<div align="center">

How to Add new tabs in the navbar ?


Doing dropdowns from the navbar is quite easy to do... All you need to do is look at existing code for "Forum Actions" for example and it is self explanatory.

Doing drop downs from the tabs are not so easy... Anyway, here is what you asked for:

Quote:
Originally Posted by Goofy

http://www.vbulletin.org/forum/showthread.php?t=226914


Quote:

Here's a pretty simple method for creating a new tab in the navbar, along with a submenu to go along with it. All you need is a unique condition for when your tab will be shown. What you will be making is a plugin to create the Nav Link along with a submenu which Link 1, Link 2, Link 3, and Drop Down which then drops down and has SubLink 1, SubLink 2, and SubLink 3. This is shown below.










This article is NOT to be used just to add another link to a submenu. It is for creating the Nav Link tab along with all the submenus. Again, if all you want is to add submenus to an existing tab, then this article is NOT for you!!!

This article is also for use by users who understand the basics of conditions and can write them. The navbar is not really an easy thing to play with if you don't know what you are doing - I think even Wayne said it had issues - so don't try this if you don't understand how to write a condition.


OK, with that out of the way....

Here's the basic template for making your new tab:

Create a plugin (Plugins & Products) > Add New Plugin:

hook location - process_templates_complete *

Title - New Tab for Navbar

Execution Order - 5


(* I used to have this listed as global_state_check but then noticed vb themselves use the process_templates_complete hook location, so I changed it.)

PHP Code:



كود HTML:
$tabselected = ''; 
 $tablinks = ''; 
 if (THIS_SCRIPT == 'yourpage') 
 { 
     $vbulletin->options['selectednavtab']='unique_name'; 
     $tabselected = ' class="selected"'; 
     $tablinks = '                <ul class="floatcontainer"> 
                          <li><a href="link1.php">Link 1</a></li> 
                             <li class="popupmenu"> 
                                 <a href="javascript://" class="popupctrl">Drop Down</a> 
                                 <ul class="popupbody popuphover"> 
                                          <li><a href="sublink1.php">SubLink 1</a></li> 
                                          <li><a href="sublink2.php">SubLink 2</a></li> 
                                          <li><a href="sublink3.php">SubLink 3</a></li> 
                                 </ul> 
                             </li> 
                          <li><a href="link2.php">Link 2</a></li> 
                          <li><a href="link3.php">Link 3</a></li> 
                 </ul> '; 
 
 }  
 $template_hook['navtab_end'] .= '<li'.$tabselected.'><a class="navtab" href="link.php">Nav Link</a>'.$tablinks.'</li>' ;  
    


Things to take note of:

PHP Code:


كود HTML:
 if (THIS_SCRIPT == 'yourpage')  


Your condition MUST be unique! If you use a condition that is also going to evaluate to true for another tab, then they will both be highlighted and the wrong submenu may show up underneath.



PHP Code:

كود HTML:
$vbulletin->options['selectednavtab']='unique_name';  

The 'seletednavtab' must also be a unique name. Again, if you have two tabs with the same 'selectednavtab' name, then both tabs will be highlighted.

PHP Code:


كود HTML:
$template_hook['navtab_end'] .= '<li'.$tabselected.'><a class="navtab" href="link.php">Nav Link</a>'.$tablinks.'</li>' ;  

You may use a different template_hook here - it just depends on where you want your tab to be - navtab_start and navtab_middle are also available.


ragtek also posted an article to do the same thing only using a template with the plugin - [HOW TO - vB4] Create a New Tab in the navbar (with template)



Originally posted on vb.org 2009-10-27.
Quote:
Originally Posted by Goofy

http://www.vbulletin.org/forum/showthread.php?t=228313


Quote:

I know that lynne allready postet an article, but here's a other way:

This tutorial will show you, how to add own links to your navbar.
(In the tutorial i'll use the code for my news add-on)


1. create a template (ragtek_news_navbar)


كود HTML:
     <vb:if condition="$vboptions['selectednavtab'] == 'ragteknews'">
<li class="selected">
    <a class="navtab" href="news.php{vb:raw session.sessionurl_q}">{vb:rawphrase ragtek_news}</a>
<ul class="floatcontainer">
<li><a href="#">#</a></li>
</ul>
</li>
<vb:else />
<li><a class="navtab" href="news.php{vb:raw session.sessionurl_q}">{vb:rawphrase ragtek_news}</a></li>
</vb:if> 


2. Create a plugin at the hook process_templates_complete
PHP Code:


كود HTML:
 if (THIS_SCRIPT == 'xxx')  // also defined('ragteknews') possible 
 { 
 //set selected tab 
     $vbulletin->options['selectednavtab'] = 'ragteknews'; 
 } 
 // add the "subtemplate" to the navbartemplate 
 $template_hook['navtab_middle'] .= vB_Template::create('ragtek_news_navbar')->render();  
    



As you see, i've defined "ragteknews" on my news.php page.If ragteknews is defined, $vbulletion->options['selectednavtab'] will be set to ragteknews.
Thats important because where using a condition in the template:



كود HTML:
<vb:if condition="$vboptions['selectednavtab'] == 'ragteknews'"> 

Quote:
Originally Posted by Goofy
http://www.vbulletin.org/forum/showthread.php?t=228338


Quote:
Some people really like the drop down navigation that is found in the Vbulletin 3.0 series, or are looking to add additional drop down navigation to the navbar in Vbulletin 4.0. This plugin and new template will allow you to do that.


First, is to goto the Plugins and Products section, this section is in the left hand column of the admin panel near the bottom. In that section you will need to click the option to "Add New Plugin". Note that the red text from both the plugin and template must be the same. You can name it whatever you want, but they must match.

For the new plugin you will enter the following details.

Hook Location
: process_templates_complete

Title
: Whatever You Want

Code
:


كود HTML:
     global $template_hook;
$newTemplate = vB_Template::create('dropdown');
$template_hook['navtab_end'] .= $newTemplate->render(); 
For step two. You need to make the template that will be used in the navbar. Simply goto the style manager and in choose "Add New Template" from the options. From there, you just need to enter the following.
Title: dropdown

Code
:


كود HTML:
    <li class="popupmenu">
<a href="javascript://" class="popupctrl navtab" style="background:transparent url({vb:stylevar imgdir_misc}/arrow.png) no-repeat {vb:stylevar right} center; padding-right: 15px">Drop Bombs</a>
<ul class="popupbody popuphover">
 <li><a style="text-indent: 0px; color:{vb:stylevar navbar_selected_popup_body_a_Color}" href="sublink1.php">SubLink 1</a></li>
 <li><a style="color:{vb:stylevar navbar_selected_popup_body_a_Color}" href="sublink2.php">SubLink 2</a></li>
 <li><a style="color:{vb:stylevar navbar_selected_popup_body_a_Color}" href="sublink3.php">SubLink 3</a></li>
</ul>
</li> 
The Following User Says Thank You to quickening For This Useful imxtra77