Jump to content
  • Announcements

    • scriptznulled

      Downloads   09/18/2017

      We're aware of files that are not completed when Downloading that's because we still need work on them, main areas are vb4, ips4 and ipb
Sign in to follow this  
scriptznulled

Staff Page

1 post in this topic

scriptznulled    108
Founder

Go to Applications >  Create New Page.  


In the url Portion: staff


Go to Page Options place this inside.

 

<div class="staff-section">
<div class="staff-title green">Owners</div>
<div class="staff-users">

<div class="staff-user-a">
<a href="# class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/_Nickk/64.png" alt="Owner">
<h4 class="staff-user-title">_Nickk</h4>
<div class="staff-rank green">Owner</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/Jacobg2011/64.png" alt="Owner">
<h4 class="staff-user-title">Jacobg2011</h4>
<div class="staff-rank green">Owner</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/IgnitingIce/64.png" alt="Owner">
<h4 class="staff-user-title">IgnitingIce</h4>
<div class="staff-rank green">Owner</div>
</a>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title salmon">Admins</div>
<div class="staff-users">

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/NHFLX/64.png" alt="Admin">
<h4 class="staff-user-title">NHFLX</h4>
<div class="staff-rank salmon">Admin</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/Strikefire150/64.png" alt="Admin">
<h4 class="staff-user-title">Strikefire150</h4>
<div class="staff-rank salmon">Admin</div>
</a>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title dark_purple">Sr. Moderators</div>
<div class="staff-users">

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/HellomanMC/64.png" alt="SrMod">
<h4 class="staff-user-title">HellomanMC</h4>
<div class="staff-rank dark_purple">Sr. Moderator</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/Katitude/64.png" alt="SrMod">
<h4 class="staff-user-title">Katitude</h4>
<div class="staff-rank dark_purple">Sr. Moderator</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/UnknownMelody/64.png" alt="SrMod">
<h4 class="staff-user-title">UnknownMelody</h4>
<div class="staff-rank dark_purple">Sr. Moderator</div>
</a>
</div>

<div class="staff-user-a">
<a href="#" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/PeachDaBoss/64.png" alt="SrMod">
<h4 class="staff-user-title">PeachDaBoss</h4>
<div class="staff-rank dark_purple">Sr. Moderator</div>
</a>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title light_purple">Jr. Moderators</div>
<div class="staff-users">

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Beastyhardy/64.png" alt="JrMod">
<h4 class="staff-user-title">Beastyhardy</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/CrazyDutchBoy/64.png" alt="JrMod">
<h4 class="staff-user-title">CrazyDutchBoy</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Beetley/64.png" alt="JrMod">
<h4 class="staff-user-title">Beetley</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/UIGaming/64.png" alt="JrMod">
<h4 class="staff-user-title">UIGaming</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Wavy_Buster/64.png" alt="JrMod">
<h4 class="staff-user-title">Wavy_Buster</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Wildfur/64.png" alt="JrMod">
<h4 class="staff-user-title">Wildfur</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/The7thCpt/64.png" alt="JrMod">
<h4 class="staff-user-title">The7thCpt</h4>
<div class="staff-rank light_purple">Jr. Moderator</div>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title helper_blue">Helpers</div>
<div class="staff-users">

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Tactical_Fox48/64.png" alt="Helper">
<h4 class="staff-user-title">Tactical_Fox48</h4>
<div class="staff-rank helper_blue">Helper</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Misty1224/64.png" alt="Helper">
<h4 class="staff-user-title"> Misty1224</h4>
<div class="staff-rank helper_blue">Helper</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Mackiee/64.png" alt="Helper">
<h4 class="staff-user-title">Mackiee</h4>
<div class="staff-rank helper_blue">Helper</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Kaatje_/64.png" alt="Helper">
<h4 class="staff-user-title">Kaatje_</h4>
<div class="staff-rank helper_blue">Helper</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/KateBeckett/64.png" alt="Helper">
<h4 class="staff-user-title">KateBeckett</h4>
<div class="staff-rank helper_blue">Helper</div>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title orange">Developers</div>
<div class="staff-users">

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Hijacking/64.png" alt="Developer">
<h4 class="staff-user-title">Hijacking</h4>
<div class="staff-rank orange">Developer</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Simgar98/64.png" alt="Developer">
<h4 class="staff-user-title">Simgar98</h4>
<div class="staff-rank orange">Developer</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/TadahTech/64.png" alt="Developer">
<h4 class="staff-user-title">TadahTech</h4>
<div class="staff-rank orange">Developer</div>
</div>

</div>
</div>



<div class="staff-section">
<div class="staff-title yellow">Builders</div>
<div class="staff-users">

<div class="staff-user-a">
<a href="members/riley_c.57/" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/Riley_C/64.png" alt="Builder">
<h4 class="staff-user-title">Riley_C</h4>
<div class="staff-rank yellow">Head Builder</div>
</a>
</div>

<div class="staff-user-a">
<a href="members/_vc_.157/" class="avatar Avm" data-avatarhtml="true" >
<img src="https://cravatar.eu/avatar/_VC_/64.png" alt="Builder">
<h4 class="staff-user-title">_VC_</h4>
<div class="staff-rank yellow">Head Builder</div>
</a>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/curiousgeorge341/64.png" alt="Builder">
<h4 class="staff-user-title">curiousgeorge341</h4>
<div class="staff-rank yellow">Builder</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/Wevensson/64.png" alt="Builder">
<h4 class="staff-user-title">Wevensson</h4>
<div class="staff-rank yellow">Builder</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/gabrielmaennl5/64.png" alt="Builder">
<h4 class="staff-user-title">gabrielmaennl5</h4>
<div class="staff-rank yellow">Builder</div>
</div>

<div class="staff-user">
<img src="https://cravatar.eu/avatar/TiffanyGreen/64.png" alt="Builder">
<h4 class="staff-user-title">TiffanyGreen</h4>
<div class="staff-rank yellow">Builder</div>
</div>



Change to suit your needs.


Next go to Appearance > Styles > your style > Templates 


Add the following to your EXTRA.css.


**** Staff Page ****
.staff-title {
color: #fff;
background: linear-gradient(to top, rgb(246, 38, 38) 0%,rgb(161, 9, 9) 100%);
box-shadow: 0 0 10px rgba(224, 0, 0, 0.5), inset 0 0 1px 1px rgb(247, 5, 5);
text-shadow: 0 0 0 transparent, 0 1px 2px #000;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
padding: 12px 0;
text-align: center;
#border-bottom: 2px solid rgb(246, 38, 38);
#border-bottom: 2px solid rgb(246, 38, 38);
#_border-bottom: 2px solid rgb(246, 38, 38);
margin: 0 0 20px;
font: 25px 'Teko', sans-serif;
}
.staff-section {
}
.staff-users {
margin: 0 0 20px;
}
.staff-user-a {
float: left;
width: 150px;
margin-right: 20px;
#border: 1px solid rgb(246, 38, 38);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
#border-radius: 5px;
#background-color: #FFFFFF;
transition: all 0.5s ease;
}
.staff-users:after {
display: table;
content: '';
clear: both;
}
.staff-rank {
color: #fff;
background: linear-gradient(to top, rgb(246, 38, 38) 0%,rgb(161, 9, 9) 100%);
box-shadow: 0 0 10px rgba(224, 0, 0, 0.5), inset 0 0 1px 1px rgb(247, 5, 5);
text-shadow: 0 0 0 transparent, 0 1px 2px #000;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
padding: 8px 0;
text-align: center;
#border-bottom: 2px solid rgb(246, 38, 38);
# border-bottom: 2px solid rgb(246, 38, 38);
#_border-bottom: 2px solid rgb(246, 38, 38);
margin: 0 10px 10px;
font: 20px 'Teko', sans-serif;
}
.staff-user-title {
font-size: 15px;
text-align: center;
font-family: 'Teko', sans-serif;
}
.staff-user {
float: left;
width: 150px;
margin-right: 20px;
#border: 1px solid rgb(246, 38, 38);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
# border-radius: 5px;
}
.staff-user-title {
font-size: 15px;
text-align: center;
font-family: 'Teko', sans-serif;
}
.staff-user img {
display: table;
margin: 10px auto 5px;
}
.staff-user-a img {
display: table;
margin: 10px auto 5px;
}



**** Staff Page ****


Again chamge to suit your needs. You can see the staff page HERE

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×