Announcement

Collapse
No announcement yet.

[HowTo] [3.0.3] Split the navbar from the breadcrumb; and revamp it all!

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Surtain23
    replied
    Well, I don't know if I'm going to use this or the other great template modifcation you created (Match the navbar to default style). Either way, Great work and I will be "installing" one of them. Keep up the amazing work!

    Leave a comment:


  • Floris
    replied
    Thank you for the kind feedback, enjoy it and speak to you later - let me know if everything went ok.

    Leave a comment:


  • Surtain23
    replied
    Thats tight I'll try it later. Good work!

    Leave a comment:


  • Floris
    replied
    Note:

    The screenshot doesn't show the header on the site, sorry about that. But the header schrinks down and cleans up. I hope you understand.

    Replace the vbulletin default logo with your company or web site logo - if you don't have a logo you could replace it with a 24 size font for $vboptions[bbtitle] to show your forum title instead of the logo.

    The space on the welcome part can be used to display a 'paid subscription' button, or 'buy premium membership' button or 'donate today' button or a small banner or just some usercp links (and then remove it from the navbar) - there is space now, so you could do whatever you want.

    Leave a comment:


  • [HowTo] [3.0.3] Split the navbar from the breadcrumb; and revamp it all!

    [HowTo] [3.0.3] Split the navbar from the breadcrumb; and revamp it all!
    By: Floris - http://www.vBulletin-Fans.com/

    Description: This tutorial will show you how to modify your default navbar template so you can put your own logo in the breadcrumb and split the navbar and navigation (breadcrumb) to its own box and end up with an alternative header.

    Installation instructions.

    * Before you continue, first install this tempate modification: [HowTo] [3.0.3] Match the navbar to default style

    * Installed the above tweak? Good, now open the navbar template again and find this code:

    HTML Code:
    <td class="alt1" width="100%">
    <if condition="is_array($navbits)">
    <table cellpadding="0" cellspacing="0" border="0">
    <tr valign="bottom">
    	<td><a href="#" onclick="history.back(1)"><img src="$stylevar[imgdir_misc]/navbits_start.gif" alt="$vbphrase[go_back]" border="0" /></a></td>
    	<td>&nbsp;</td>
    	<td width="100%"><span class="navbar"><a href="$vboptions[forumhome].php?$session[sessionurl]" accesskey="1">$vboptions[bbtitle]</a></span> $navbits[breadcrumb]</td>
    </tr>
    <tr>
    	<td class="navbar" style="font-size:10pt; padding-top:1px" colspan="3"><a href="$scriptpath"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_finallink.gif" alt="$vbphrase[reload_this_page]" border="0" /></a> <strong>$navbits[lastelement]</strong></td>
    </tr>
    </table> 
    <else />
    <div class="navbar" style="font-size:10pt"><a href="$vboptions[forumhome].php?$session[sessionurl]" accesskey="1"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_start.gif" alt="" border="0" /></a> <strong>$vboptions[bbtitle]</strong></div>
    </if>
    </td>
    * And replace it with this code:

    HTML Code:
    <td class="alt1" width="100%"><a href="$vboptions[forumhome].php?$session[sessionurl]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
    * Find the following code:

    HTML Code:
    <!-- nav buttons bar -->
    * And above it, on a new line, add this code:

    HTML Code:
    <br />
    * Now find this code:

    HTML Code:
    </td></tr></table>
    <!-- / nav buttons bar -->
    * And it, on a new line, add this code:

    HTML Code:
    </td></tr>
    <tr><td class="alt1" width="100%">
    <if condition="is_array($navbits)">
    <table cellpadding="$stylevar[cellpadding]" cellspacing="0" border="0"><tr><td>
    <table cellpadding="0" cellspacing="0" border="0">
    <tr valign="bottom">
    	<td><a href="#" onclick="history.back(1)"><img src="$stylevar[imgdir_misc]/navbits_start.gif" alt="$vbphrase[go_back]" border="0" /></a></td>
    	<td>&nbsp;</td>
    	<td width="100%"><span class="navbar"><a href="$vboptions[forumhome].php?$session[sessionurl]" accesskey="1">$vboptions[bbtitle]</a></span> $navbits[breadcrumb]</td>
    </tr>
    <tr>
    	<td class="navbar" style="font-size:10pt; padding-top:1px" colspan="3"><a href="$scriptpath"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_finallink.gif" alt="$vbphrase[reload_this_page]" border="0" /></a> <strong>$navbits[lastelement]</strong></td>
    </tr>
    </table> 
    </td></tr></table> 
    <else />
    <div class="navbar" style="font-size:10pt"><a href="$vboptions[forumhome].php?$session[sessionurl]" accesskey="1"><img class="inlineimg" src="$stylevar[imgdir_misc]/navbits_start.gif" alt="" border="0" /></a> <strong>$vboptions[bbtitle]</strong></div>
    </if>
    * Find this code:

    HTML Code:
    <table class="tborder" cellpadding="0" cellspacing="1" border="0" width="100%" align="center" style="border-top-width:0px">
    * And replace it with this code:

    HTML Code:
    <table class="tborder" cellpadding="0" cellspacing="1" border="0" width="100%" align="center">
    * You are nearly done, save the navbar template.

    * Now open the header template, and find this code and delete it:

    HTML Code:
    <table border="0" width="$stylevar[outertablewidth]" cellpadding="0" cellspacing="0" align="center">
    <tr>
    <td align="$stylevar[left]"><a href="$vboptions[forumhome].php?$session[sessionurl]"><img src="$stylevar[titleimage]" border="0" alt="$vboptions[bbtitle]" /></a></td>
    <td align="$stylevar[right]">
    &nbsp;
    <!--
    NEW HEADER &amp; NAVBAR
     
    Now that the nav buttons are in the
    navbar template, you can stick whatever
    you like into this space.
    This makes it much easier for novice
    admins to customize their header
    template without affecting important
    navigation elements.
    -->
    </td>
    </tr>
    </table>
    * Now you are done! Save the header template and go check it out.
    Attached Files
    Last edited by Floris; Thu 7 Oct '04, 3:22am.
widgetinstance 262 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
Working...
X