Official Alliance Mascot

Official Alliance Blogroll: 50 Freshest


Alliance Full Membership Roster

Annoy Your Hostess

Filthy Lie & PGH Assignment Wrangler

Questions? Comments? Filthy Lies?

Specialites Blog

  • Blackfive's Alliance Specialties Blog
    The Alliance Pathfinder:While behind the lines, the Alliance Pathfinder looks for new Alliance members, Minions to turn to our side, and provide photographic evidence of the vileness of our common Enemy.

Our Community

Music to Whack Terrorists by

« Monday Linky Stuff | Main | Wednesday Linky Stuff »

October 11, 2005

Playing hide and go seek

Susie, our gracious hostess with the mostess, forwarded an e-mail request for a blog tip. Since I hadn't wrapped up a blogging tip for today I decided to post this instead. The question at hand is how can a drop down menu be setup for the Alliance blogroll.

I checked out a couple of options and from what I could find there isn’t a way to add it to a combo box, I'm not saying there isn’t a way, but I haven’t looked very hard found one.

There is a way however to have lists and other information hidden on your page until somebody clicks a link.  The Archives and Categories links on my blog are an example of this feature, the same type of feature is in use at Multiple Mentality. Adding this feature requires adding a bit of java script to your template and modifying the sidebar a bit, so be sure you have a backup of your template first.

First we'll need to add the following code between the <head> </head> tags in your template.

<script type="text/javascript">

function toggle( targetId ){
  if (document.getElementById){
        target = document.getElementById( targetId );
           if (target.style.display == "none"){
              target.style.display = "";
           } else {
              target.style.display = "none";
           }
     }
     return false;
}
</script>

Adding the script above covers the first half of hiding the text. The second half of the process involves adding the information to your sidebar. With the millions of templates and options available you may need to tweak the items in blue a bit to match your exact template structure.

<h3><a href="#" OnClick="return toggle('TheAllianceBlogroll')">The Alliance Blogroll</a></h3>
<div class="side" id="TheAllianceBlogroll" style="display:none" align="left" >
<!-- Start hidden information -->
<script language="javascript" type="text/javascript"
src="http://rpc.blogrolling.com/display.php?r=811a7ed03b3e3e9e24350479556303de">
</script>

<!-- End hidden information -->
</div>

The <h3> tags would be changed to match your setup for sidebar headers. The class="side" should also be changed to match the tags that are used to display general information in your sidebar. Once you've saved the changes and rebuild your template there should be a link titled: The Alliance Blogroll that when clicked displays the blogroll for your browsing pleasure.

The information that is in bold may be changed to create new section that play hide n' seek, the important part is that the part beside toggle and id have to match and there can only be one set.

If you have any questions or blogging tips be sure to send us an e-mail and we'll get right on it!!!

TrackBack

TrackBack URL for this entry:
http://www.typepad.com/t/trackback/1081/3350685

Listed below are links to weblogs that reference Playing hide and go seek:

» MEANWHILE AT ALLIANCE HQ from Bad Example
Filthy Lie Assignment Reminder: What do the voices in Evil Glenn's head tell him to do? Is due by 11pm EDT Friday, October 14th. Late entries must be accompanied by a lame excuse. Wednesday Linky Stuff Precision Guided Humor Round-up:... [Read More]

Comments

Trying this with Typepad. Unless there is something I am missing, you have to be using an advanced template to make it work. WIth advance, do not have to change squat.

Got the first code to be implanted in the header by using the Custom CSS with a non-advanced template, but cannot get the proper wording, if there is on, when implanting the second code into a typelist.

This worked great in Blogger, except I can't figure out how to get my new headers to be the same color as my regular headers. Where do I change the font color in this script?

Never mind - figured it out!

Post a comment

Comments are moderated, and will not appear on this weblog until the author has approved them.

Frankly speaking

More Alliance Members

Still More Alliance Members

Even More Alliance Members

Newest Alliance Members

Very Newest Members

What? Even More?

Blog powered by TypePad
Member since 07/2003

White Glenn's Storytime