Creating a better toolbar on your blog

When I converted the WordPress theme NightVision into a Movable Type style, I had to create a menu bar. By default, the Personal Blog template set does not support such a thing, but it's not very hard to add. In fact, when you use the LinkRoller plugin that Arvind created, implementing and managing one is really easy. Here's how.


menubar_example.pngAll this menu bar is, is a divider with an unorder list. Before you get started, download the LinkRoller plugin and install it on your blog.

Now, go to Create->Link and create a few links and tag them "toptoolbar." The reason that these links are going to be tagged is that it will make them identifiable to the <mt:Assets> tag. Now, create a template module in the Templates management area with the following content:

<div id="menu">
    <ul>
        <mt:Assets tag="toptoolbar" sort_order="ascend" sort_by="label">
            <li class="page_item">
                <a href="<$mt:AssetURL$>"><$mt:AssetLabel$></a>
            </li>
        </mt:Assets>
    </ul>
</div>

Save that module as "MenuBar", and then go to each archive template and index template that is a web page, and add <mt:Include module="MenuBar"/> to the space between <div id="content-inner"> and <div id="alpha">. Rebuild your blog, and you'll now have a toolbar the top. However, in order to make it display properly, you will have to add some style information to your blog. If you don't want to edit the files that are bundled under mt-static, create a new index template called "StyleSheet Supplement" and add some CSS instructions based on the following example:

#menu
{
    width: 950px;
    height: 60px;
    margin-bottom: 30px;
}

#menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#menu li {
    display: inline;
    text-transform: uppercase;
}

Tell it to output as "stylesupplement.css" and save the template. Then, open the Stylesheet index template, add @import url(<mt:BlogURL/>stylesupplement.css);. Save and rebuild.

No TrackBacks

TrackBack URL: http://www.codemonkeyramblings.com/mt/mt-trackback.cgi/669

Leave a comment

January 2009

Sun Mon Tue Wed Thu Fri Sat
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31

Blogroll

Site Information

OpenID accepted here Learn more about OpenID

Creative Commons License
This blog is licensed under a Creative Commons License.
Powered by Movable Type 4.23-en
   

Site Credits

   
        Wordpress Themes by TemplateLite