 |
|
|
Mod Options |
Add Icons to the Navigation Bar Tabs Details »»
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Add Icons to the Navigation Bar Tabs
Developer Last Online: May 2013 
Hi there, everyone!
 Prior to the vBulletin 4.0 upgrade, I had these neat little icons in the navigation bar of my v 3.8 forum's theme. Since I upgraded the forums, I wanted to put these icons back once again. However, with the rewrite of the whole code, I was at a complete loss as to where to make these changes. After a lot of searching and hit and trial, however, I did manage to come up with something that suited my needs. So I thought I'd write an article myself, with the hope that it would help others trying to do something similar. These template modifications allow you to add icons to the tabs in the Navigation Bar, right below the logo, as shown in the image below:  I'll stick with the default Navigation Bar tabs, i.e. Home, Forum, Blogs and What's New. Although you may use images of any size, but since I did not want to meddle too much with the default design / layout, I resized all the images to 24px × 24px. Note: I have colour coded all code edits / additions in red to make it easier to see what has been added. Note: You may find instructions for vB 4.1.2 over here. ------------------------------ "Home" Tab: (2 modifications needed in only 1 template) In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > vBulletin CMS Templates > vbcms_navbar_link Here, look for the following code:
Replace this with:
Now find:
Replace with:
Remember to press "Save" after making these changes to the template. ------------------------------ "Forum" Tab: (3 modifications needed in only 1 template) In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Navigation / Breadcrumb Templates > navbar Here, look for the following code:
Replace this with:
Now find:
Replace with:
Finally find:
Replace with:
Remember to press "Save" after making these changes to the template. ------------------------------ "Blogs" Tab: (2 modifications needed in only 1 template) In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Blog Templates > blog_navbar_link Here, look for the following code:
Replace this with:
Now find:
Replace with:
Remember to press "Save" after making these changes to the template. ------------------------------ "What's New" Tab: (4 modifications needed in only 1 template) In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Navigation / Breadcrumb Templates > navbar Here, look for the following code:
Replace this with:
Now find:
Replace with:
Find:
Replace with:
Finally find:
Replace with:
Remember to press "Save" after making these changes to the template. Download Now Only licensed members can download files, Click Here for more information. Show Your Support
No members have liked this post.
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
About Developer
Not Supported 
Template Edits|
#46
24 Jan 2011, 18:04
|
|||
|
|||
|
update to 4.1.1?
No members have liked this post.
|
|
#47
25 Jan 2011, 03:26
|
||||
|
||||
|
Originally Posted by horussjr
I 2nd the question
Please & thank you
__________________
If you're thinking of closing your site, would still like your members to have a home, but still want to keep ownership of your software for possible later use, please contact me. No members have liked this post.
|
|
#48
25 Jan 2011, 22:45
|
||||
|
||||
|
Installed (kind of)
4.1.1 I have all the icons listed showing, except the HOME icon only shows on the CMS page & no where else. Will attempt to learn how to apply this on a few other tabs I have.
__________________
If you're thinking of closing your site, would still like your members to have a home, but still want to keep ownership of your software for possible later use, please contact me. No members have liked this post.
|
|
#49
26 Jan 2011, 01:13
|
||||||||||||||||
|
||||||||||||||||
|
Ok, I'll be honest with you guys. I have not upgraded to 4.1.1 (still at 4.0.6), so can't really test this anymore but I'll try to guide you guys a bit in the hope that you'll be able to manage the rest.
"Home" Tab: In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > vBulletin CMS Templates > vbcms_navbar_link In this template, look for the text {vb:rawphrase site} and insert the code given below BEFORE this text, wherever and as many times as you find it.
Remember to press "Save" after making these changes to the template. ------------------------------ "Forum" Tab: In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Navigation / Breadcrumb Templates > navbar In this template, look for the text {vb:rawphrase forum} and insert the code given below BEFORE this text, wherever and as many times as you find it.
Remember to press "Save" after making these changes to the template. ------------------------------ "Blogs" Tab: In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Blog Templates > blog_navbar_link In this template, look for the text {vb:rawphrase blogs} and insert the code given below BEFORE this text, wherever and as many times as you find it.
Remember to press "Save" after making these changes to the template. ------------------------------ "What's New" Tab: In your Admin Control Panel (ACP), go to: ACP > Styles & Templates > Style Manager > Double arrows on the right of the style you want to edit (Expand Templates) > Navigation / Breadcrumb Templates > navbar In this template, look for the text {vb:rawphrase getnew_tab} and insert the code given below BEFORE this text, wherever and as many times as you find it.
Remember to press "Save" after making these changes to the template. ------------------------------ No members have liked this post.
|
||||||||||||||||
|
#50
26 Jan 2011, 04:21
|
||||
|
||||
|
Confirmed.
Was basically what I did on mine. Was going to report the fix, but you got to it before me. lol Installed & working 4.1.1
__________________
If you're thinking of closing your site, would still like your members to have a home, but still want to keep ownership of your software for possible later use, please contact me. No members have liked this post.
|
|
#51
26 Jan 2011, 04:40
|
||||
|
||||
|
Thank you for confirming, OldSchoolDSL. Glad that it works.
No members have liked this post.
|
|
#52
26 Jan 2011, 09:09
|
||||
|
||||
|
Working fine as well.
I still have this problem. I have Picture and Album Gallery for vB4 http://www.vbulletin.org/forum/showt...ighlight=Album installed I want to add a picture to the Tab but I don't know how to. I also have this installed: http://www.vbulletin.org/forum/showt...ht=double+tabs I tried to add this:
Any help would be great, thanks. No members have liked this post.
|
|
#53
28 Jan 2011, 06:54
|
||||
|
||||
|
Well, I don't have either of the above mods installed. But if you could give me access to an admin account, perhaps I could have a look and see what can be done.
No members have liked this post.
|
|
#54
05 Feb 2011, 00:05
|
|||
|
|||
|
Originally Posted by New Joe
Sounds as if you are deleting the code after the image code ( code in red ) , when you should be inserting the code in red.
No members have liked this post.
|
|
#55
08 Feb 2011, 14:46
|
||||
|
||||
|
Ok, little adjustments here for those who are stuck with the icons on different tabs then HOME-BLOG etc etc
I have the tabs vbSoporte, Experience and V3Arcade in the navbar. In order to get the icons to show in those, the easiest way is t o paste the code with in the Navbar link options from the MOD! Example: v3Arcade General Settings/Arcade Name I pasted my code like this where you write the name of the tab
Same thing in vbSoporte, code always after the title or else it will cut the text because of the maximum width of the tab. I also pasted every code in the templates after the " {vb:rawphrase forum}" or other templates you add your icons! This way it will look more uniform and aligned. Hope it help out a bit  No members have liked this post.
|
||||
|
#56
08 Feb 2011, 18:10
|
||||
|
||||
|
Yup, that's absolutely right, fxwoody. I didn't suggest it on the thread because it may or may not work, depending on the mod.
I am using the same method with this mod as well. http://www.vbulletin.org/forum/showthread.php?t=228507 No members have liked this post.
|
|
#57
09 Feb 2011, 01:34
|
||||
|
||||
|
Played around a lot to figure out why it wasn't working well but...lol with patience
No members have liked this post.
|
|
#58
09 Feb 2011, 13:01
|
||||
|
||||
|
شكرا عبد الباسط .. سيتم تجربة الأمر لاحقا .. تحياتي
No members have liked this post.
|
|
#59
09 Feb 2011, 17:46
|
||||
|
||||
|
اهلا وسهلا بكم
No members have liked this post.
|
|
#60
01 Mar 2011, 15:26
|
||||
|
||||
|
The Home Nav bar button icon added successfully and works great!
I just followed the instructions of post 49. Thank you, abdulbasitsaeed... No members have liked this post.
|
|
«
Previous Mod
|
Next Mod
»
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) |
| Mod Options | |
|
|
| New To Site? | Need Help? |
All times are GMT. The time now is 23:13.