Enter your email address:

Delivered by FeedBurner


Sign up to receive a reply:

Powered by MT-Notifier

user-pic

Adding additional page tabs to the header

Vote 0 Votes

For any new or existing page that you would like to show up on the top navigation bar, just add "@topnav" to the Tags field. To modify your existing pages, go to Manage > Pages. Click on it, and you should see a Tags field below the body.

I think Movable Type developers missed something when they created the Professional Website template. They hard-coded the tab links into the layout, meaning that when you create your own "Pages" in Movable Type, they don't show up as new tabs automatically. You still just get: Home | Blog | About | Contact

To fix this, first you'll want to create a folder to keep your tab navigation pages separate from other pages. You might start creating pages that you don't want linked from the home page.

***Creating a new folder
(1) In UThink, go to Manage, then Folders.
(2) Click "Create Top Level Folder"
(3) Call it "Tab Navigation", then click Create.
(4) Now go to Manage, then Pages.
(5) Open up each page that you want linked from a tab and assign it your new folder, "Tab Navigation."

***Modifying the templates
(6) Now go to Design, then Templates
(7) Scroll down to the Navigation template module and click on it.
(8) Do you see the three blocks (they should be lines 5-18)? Delete all three blocks (@topnav @about and @contact.)
(9) In the same spot where you deleted, paste in this code:


<mt:Pages folder="Tab Navigation">
<li class="<mt:If name="nav_on" eq="$this_page_id"> on</mt:If>"><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
</mt:Pages>


Save and Re-build your blog site. That should do it!

3 Replies

| Add a Reply
  • After using my own instructions for a little while, I'm starting to think that using tags would be better than using folders to create the same behavior. If you put all of your tab navigation pages in one folder, then the pages will have a URL like this:

    http://blog.lib.umn.edu/heinz062/uthink-forum/tab-navigation/about

    So you could replace the "Creating a new folder" steps with this:
    When you create a page that you would like to show up as a tab on your home page, add a tag to the Tags field, like "tab".

    Then, in step 9, you would replace [folder="Tab Navigation"] with [tag="tab"].

  • I just realized that's exactly what the original designers had in mind with the "@topnav" tag. If you look at the Navigation template module, there's code that brings in @home pages, but the limit is set to 1. But there is no limit for @topnav. The only limit is simply the left-to-right space available in that top bar.

  • If you want to adjust the order in which your @topnav pages appear, it's tricky. I believe the default is to sort by created date (latest to the left). You could sort it by title. Open up the template module called "Navigation", then find the line <mt:Pages tag="@topnav">. Change it to <mt:Pages sort_by="title" sort_by="ascend" tag="@topnav">. The only sort_by values that I have found are "created_on" and "title". If that's not sufficient, open the Navigation module. See how pages are being embedded by tag? Copy one of the page embeds:

    <mt:Pages tag="@topnav">
    <mt:SetVarBlock name="this_page_id"><$mt:PageID$></mt:SetVarBlock>
    <li class="<mt:If name="nav_on" eq="$this_page_id"> on</mt:If>"><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
    </mt:Pages>

    But change the tag name to your own custom tag. You can create as many of these as you like. The order in which they appear in the code is the order that they will appear left-to-right across your navigation bar.

Add a Reply

Forum Groups

Classic Blogs and General Info

29 42

Last Topic: Can I use PHP code in my blog? by Charlie Heinz on Jan 9, 2012

Discussions

Q&A

Be the first to post a topic in this forum

Blogging Principles

Be the first to post a topic in this forum

Other Template Sets

Community Blogs

Be the first to post a topic in this forum

Community Forums

Be the first to post a topic in this forum

Widget Marketplace