Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Recruiting Box?
Mottie (MVP) 7/10/2008 5:05 AM EST : RE: Recruiting Box?
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

With the improvements in the GuildPortal editor, it no longer strips out your CSS styles in your content box when you re-edit your box. So if you don't want to mess around with your Custom StyleSheet, just include all the code in the content box. Add a <style type="text/css"> at the beginning of the CSS and a </style> at the end. Example below:
<style type="text/css">
.druid {color: #ff7d0a; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/druid.gif) no-repeat; height:18px; padding-left:20px; }
.hunter {color: #abd473; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/hunter.gif) no-repeat; height:18px; padding-left:20px; }
.mage {color: #69ccf0; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/mage.gif) no-repeat; height:18px; padding-left:20px; }
.paladin {color: #f58cba; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/paladin.gif) no-repeat; height:18px; padding-left:20px; }
.priest {color: #ffffff; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/priest.gif) no-repeat; height:18px; padding-left:20px; }
.rogue {color: #fff569; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/rogue.gif) no-repeat; height:18px; padding-left:20px; }
.shaman {color: #2459ff; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/shaman.gif) no-repeat; height:18px; padding-left:20px; }
.warlock {color: #9482ca; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/warlock.gif) no-repeat; height:18px; padding-left:20px; }
.warrior {color: #c79c6e; background: url(http://www.guildportal.com/GuildImages/WOWRosterImages/warrior.gif) no-repeat; height:18px; padding-left:20px; }
.deathknight {color: #c41e3b; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/dk.png) no-repeat; height:18px; padding-left:20px; }
.check {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/check.gif) no-repeat; height:18px; padding-left:20px;}
.nocheck {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/nocheck.gif) no-repeat; height:18px; padding-left:20px;}
.closed {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/closed.gif) no-repeat; height:18px; padding-left:20px;}
</style>
<center>
<table border="0"><tbody>
<tr><td class="deathknight">Death Knight</td><td class="nocheck">
</td></tr><tr><td class="druid">Druids</td><td class="check">
</td></tr><tr><td class="hunter">Hunters</td><td class="check">
</td></tr><tr><td class="mage">Mages</td><td class="check">
</td></tr><tr><td class="paladin">Paladins</td><td class="check">
</td></tr><tr><td class="priest">Priests</td><td class="check">
</td></tr><tr><td class="rogue">Rogues</td><td class="check">
</td></tr><tr><td class="shaman">Shamans</td><td class="check">
</td></tr><tr><td class="warlock">Warlocks</td><td class="check">
</td></tr><tr><td class="warrior">Warriors</td><td class="check">
</td></tr>
</tbody></table>
</center>
Edit: I updated the original posts with this change
TopBottom

Ciannon (Guild Admin) 7/10/2008 8:12 PM EST : RE: Recruiting Box?
Ciannon
Posts: 2000
Zomgawsh Poster

Mottie, without actually putting in any code, I'm assuming that the following posted by you is a table in which check marks can be enabled/disabled with the "check" / "nocheck" css. Is this true, or do I need to put all the code that you have listed? I'm going to try and see what happens I'll contact you in a few mins when I break something. lol

<center>
<table border="0">
<tbody><tr><td class="druid">Druids</td><td class="nocheck">
</td></tr><tr><td class="hunter">Hunters</td><td class="check">
</td></tr><tr><td class="mage">Mages</td><td class="check">
</td></tr><tr><td class="paladin">Paladins</td><td class="check">
</td></tr><tr><td class="priest">Priests</td><td class="check">
</td></tr><tr><td class="rogue">Rogues</td><td class="check">
</td></tr><tr><td class="shaman">Shamans</td><td class="check">
</td></tr><tr><td class="warlock">Warlocks</td><td class="check">
</td></tr><tr><td class="warrior">Warriors</td><td class="check">
</td></tr>
</tbody></table>
</center>


*Edit* OK, you do have to use some of the form from above. However, if you don't want any images, here's the code I used.

<style type="text/css">
.check {background:url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/check.gif)no-repeat; height:18px; padding-left:20px;}
.nocheck {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/closed.gif) no-repeat; height:18px; padding-left:20px;}
</style>
<center>
<br><table border="0">
<tbody>
<tr><td class="hunter">Assassin</td><td class="check">
<br></td></tr><tr><td class="mage">Barbarian</td><td class="check">
<br></td></tr><tr><td class="paladin">Bear Shaman</td><td class="check">
<br></td></tr><tr><td class="priest">Conquerer</td><td class="check">
<br></td></tr><tr><td class="rogue">Dark Templar</td><td class="check">
<br></td></tr><tr><td class="shaman">Demonologist</td><td class="check">
<br></td></tr><tr><td class="warrior">Guardian</td><td class="check">
<br></td></tr><tr><td class="warrior">Herald of Xotli</td><td class="check">
<br></td></tr><tr><td class="warrior">Necromancer</td><td class="check">
<br></td></tr><tr><td class="warrior">Priest of Mitra</td><td class="check">
<br></td></tr><tr><td class="warrior">Ranger</td><td class="check">
<br></td></tr><tr><td class="warrior">Tempest of Set</td><td class="check">
<br></td></tr>
</tbody></table>
</center>


*NOTE* You don't need to change the "<td class="CLASS NAME"> for this to work. I just left it alone.

Here's what it looked like. I had a Typo when I originally did this, but I fixed it in the above coding. Just to lazy to redo the screenshot.






Epic quotes from Coils:

"lol out of money. I bought my system and forgot to factor in the cost of the game." - Coils 7/14/2008
"No money totaled my car. Cant play. Probly selling my computer. Adios." - Coils 8/25/2008


TopBottom

RedRydur (Guild Admin) 7/11/2008 8:29 AM EST : RE: Recruiting Box?
RedRydur
Posts: 1065
Zomgawsh Poster



I use an Image for each class. The benifit of this method is when I need to update a class I just upload the new image with the same filename, no need to edit the content box. I also use the image map editor to link to our guild policy.
---------------------------------------------
-
RedRydur the Pure
TopBottom

Mottie (MVP) 7/14/2008 8:34 AM EST : RE: Recruiting Box?
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Ciannon: Yep, what you did was right. Leaving in the class name in the table cell won't effect anything you're doing so it's nothing to worry about.

RedRyder: Nice recruitment box! It's very stylish and clean - I like it! I'm guessing "Wanted" is a higher priority than "Open"?

Also wanted to put a note here that I updated the original posts.
  • With the GuildPortal editor no longer removing your CSS inside of your content boxes when you re-edit it, adding the CSS to the content box allows you to continue editing your site with the control panel styles, without the need of enabling a Custom StyleSheet (if you don't have one).
  • Added the Death Knight Hero class to the recruitment box now that the image and the class color is available 
TopBottom

RedRydur (Guild Admin) 7/14/2008 12:23 PM EST : RE: Recruiting Box?
RedRydur
Posts: 1065
Zomgawsh Poster

Mottie said:


RedRyder: Nice recruitment box! It's very stylish and clean - I like it! I'm guessing "Wanted" is a higher priority than "Open"?


Thanks Mottie!
Means alot coming from you. I am trying to keep the site "clean" and I am still working on it. My next mission is to implement your roll over tabs soon as I have time. Check out the site if you have time avatarsofmight.com .

And "Wanted" does mean the highest priority.
---------------------------------------------
-
RedRydur the Pure
TopBottom

539318192_Inactive (New Admin) 7/18/2008 4:51 AM EST : RE: Recruiting Box?

539318192_Inactive
Posts: 255
Fingers of Fury!

Heya Gang,

I was trying to update my Rec. Box. Now when I go in and type down, I lose the page. Whenever you get a second could you check it out and see what I'm doing wrong?
Thanks,:)

http://seize-tomorrow.guildportal.com/Guild.aspx?GuildID=219030&TabID=1846783
TopBottom

Mottie (MVP) 7/18/2008 5:03 AM EST : RE: Recruiting Box?
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

I can't see what's wrong, I saved your page source and changed the "up" to "down" and it worked perfectly. Maybe you are changing it in the wrong place?... I can't think of anything else. The end of the line should look like this:
<td class="down">
If that doesn't work, then paste the code you are using here, so I can help better
TopBottom

539318192_Inactive (New Admin) 7/21/2008 12:20 AM EST : RE: Recruiting Box?

539318192_Inactive
Posts: 255
Fingers of Fury!

Sorry Mottie,

I went away for a few days, here is the code you requested.

<center>
<table border="0"><tbody>
<tr><td class="deathknight">Death Knight</td><td class="nocheck">
<br></td></tr><tr><td class="druid">Druids</td><td class="check">
<br></td></tr><tr><td class="hunter">Hunters</td><td class="check">
<br></td></tr><tr><td class="mage">Mages</td><td class="check">
<br></td></tr><tr><td class="paladin">Paladins</td><td class="check">
<br></td></tr><tr><td class="priest">Priests</td><td class="check">
<br></td></tr><tr><td class="rogue">Rogues</td><td class="check">
<br></td></tr><tr><td class="shaman">Shamans</td><td class="check">
<br></td></tr><tr><td class="warlock">Warlocks</td><td class="check">
<br></td></tr><tr><td class="warrior">Warriors</td><td class="check">
<br></td></tr>
</tbody></table>
</center>
TopBottom

Mottie (MVP) 7/21/2008 2:01 AM EST : RE: Recruiting Box?
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

DOH... I must have been tired LOL...

You don't have a "down" you have the CSS for "closed" () and "nocheck" (). Up and down were only used with the rounded images.
TopBottom

Mottie (MVP) 7/24/2008 7:02 PM EST : AoC Recruiting Box
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Age of Conan | D&D Online | Everquest | Everquest 2 | LotRO |Warhammer | WoW round | WoW square

Age of Conan (AoC)



Content Box "Free Form Text/HTML"
<style type="text/css">
.recruitbx {background: #111111; border:0px; font-size:14px;}
.assassin {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left top no-repeat; height:18px; padding-left:20px; }
.barbarian {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -18px no-repeat; height:18px; padding-left:20px; }
.bearshaman {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -36px no-repeat; height:18px; padding-left:20px; }
.conqueror {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -54px no-repeat; height:18px; padding-left:20px; }
.darktemplar {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -72px no-repeat; height:18px; padding-left:20px; }
.demonologist {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -90px no-repeat; height:18px; padding-left:20px; }
.guardian {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -108px no-repeat; height:18px; padding-left:20px; }
.heraldofxotli {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -126px no-repeat; height:18px; padding-left:20px; }
.necromancer {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -144px no-repeat; height:18px; padding-left:20px; }
.priestofmitra {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -162px no-repeat; height:18px; padding-left:20px; }
.ranger {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left -180px no-repeat; height:18px; padding-left:20px; }
.tempestofset {color: #ffffff; background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/aocclasses.gif) left bottom no-repeat; height:18px; padding-left:20px; }
.classhd {text-align:center; color:#ffcc00; font-weight:bold; }
.check {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/check.gif) 2px 2px no-repeat; height:18px; padding-left: 20px; }
.nocheck {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/nocheck.gif) 2px 2px no-repeat; height:18px; padding-left: 20px; }
.closed {background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/closed.gif) 2px 2px no-repeat; height:18px; padding-left:20px;}
</style>
<center>
<table class=recruitbx>
<tbody><tr>
</td></tr><tr><td colspan=2 class=classhd>Soldier
</td></tr><tr><td class="conqueror">Conqueror</td><td class="check">
</td></tr><tr><td class="darktemplar">Dark Templar</td><td class="check">
</td></tr><tr><td class="guardian">Guardian</td><td class="check">

</td></tr><tr><td colspan=2 class=classhd>Priest
</td></tr><tr><td class="bearshaman">Bear Shaman</td><td class="check">
</td></tr><tr><td class="priestofmitra">Priest of Mitra</td><td class="check">
</td></tr><tr><td class="tempestofset">Tempest of Set</td><td class="check">

</td></tr><tr><td colspan=2 class=classhd>Rogue
</td></tr><tr><td class="assassin">Assassin</td><td class="closed">
</td></tr><tr><td class="barbarian">Barbarian</td><td class="check">
</td></tr><tr><td class="ranger">Ranger</td><td class="check">

</td></tr><tr><td colspan=2 class=classhd>Mage
</td></tr><tr><td class="demonologist">Demonologist</td><td class="check">
</td></tr><tr><td class="heraldofxotli">Herald of Xotli</td><td class="check">
</td></tr><tr><td class="necromancer">Necromancer</td><td class="check">

</td></tr>
</tbody></table>
</center>
Customizing the code above
  • To change the class availability from open to closed, just edit the content box text that is blue.
  • To change the color of the class name in the table, edit the CSS and change the color from #ffffff for that class to your desired color (in orange).
  • To change the style of the box (background or border), edit the CSS that is in red.
  • To change the color of the class archetype (Class header), edit the CSS in green.
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%