vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB3 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=111)
-   -   Tabs at top of this site (https://vborg.vbsupport.ru/showthread.php?t=144683)

Cooleyvol 04-12-2007 06:43 PM

Tabs at top of this site
 
Does anyone have the code for adding the tabbed navigation that exists at the top of this forum?

I'd love to use that sort of navigation for the different sections of my forum.

romanticyao 04-12-2007 06:48 PM

you might want take a look at http://www.dynamicdrive.com/style/

not exactly wut u lookin for but will give u some ideas!

dj_melayu 04-12-2007 06:50 PM

<a href="https://vborg.vbsupport.ru/showthread.php?t=143032" target="_blank">https://vborg.vbsupport.ru/showthread.php?t=143032</a>

Cooleyvol 04-12-2007 06:59 PM

Thanks, but that didnt really tell me how the tabs are added. I understand its in the header template, but does anyone have the instructions on how to write the code.

tobybird 04-12-2007 09:35 PM

Just view the source code of the page for a better understanding... I'm not trying to talk down, but it's all done with simple HTML & CSS. :)

4x4 Mecca 04-21-2007 11:18 PM

I was searching for this, and figured it out, it takes 1 template edit (navbar) and you have to add some code to the style CSS, then upload 2 images.

Dismounted 04-22-2007 12:20 AM

Actually, one image. That one image has both states of the button. Using CSS, you programmatically change the displayed pixels.

4x4 Mecca 04-22-2007 03:55 PM

2 images if you want the button width to change with the text. That's what I understand anyway.

dbirosel 05-01-2007 08:09 PM

anyone have a step by step tutorial on how to create this for our styles???please!! :)

4x4 Mecca 05-02-2007 04:52 AM

step one, pick one from here
http://exploding-boy.com/images/cssmenus/menus.html

Step 2, download the pack of menus there from here
http://www.exploding-boy.com/2005/12...ation-designs/ where it says "Download the entire menu set"

upload the images for the style you want to your images folder

Example = tableftC.gif and tabrightC.gif

Edit your styles & templates > style manager > YOUR SKIN > Main CSS
Scroll to the bottom to see "Additional CSS Definitions"
Paste the code for your css menu there.
example:
PHP Code:

 #tabsJ {
      
float:right/* left */
/*      width:100%; */
/*      background:#F4F4F4; */
      
font-size:93%;
      
line-height:normal;
/*    border-bottom:1px solid #24618E; */
      
}
    
#tabsJ ul {
    
margin:0;
    
padding:10px 0px 0 50px;
    list-
style:none;
      }
    
#tabsJ li {
      
display:inline;
      
margin:0;
      
padding:0;
      }
    
#tabsJ a {
      
float:right/* left */
      
background:url("images/tableftJ.gif"no-repeat left top;
      
margin:0;
      
padding:0 0 0 5px;
      
text-decoration:none;
      }
    
#tabsJ a span {
      
float:right/* left */
      
display:block;
      
background:url("images/tabrightJ.gif"no-repeat right top;
      
padding:5px 15px 4px 6px;
      
color:#24618E;
      
}
    
/* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsJ a span {float:none;}
    /* End IE5-Mac hack */
    #tabsJ a:hover span {
      
color:#FFF;
      
}
    
#tabsJ a:hover {
      
background-position:0% -42px;
      }
    
#tabsJ a:hover span {
      
background-position:100% -42px;
      } 

The go to your navbar template and find
Code:

        <if condition="$show['member']">
       
                <td class="alt2" valign="top" nowrap="nowrap">

ABOVE THAT PASTE

Code:

<div id="tabsJ">
  <ul>
    <li><a href="http://www.YOURFORUM.com/forum/forumdisplay.php?f=69" title="Buy and Sell with other members here."><span>Classifieds</span></a></li>
    <li><a href="http://www.YOURFORUM.com/forum/forumdisplay.php?f=133" title="Purchase products for your rig from our vendors!"><span>Vendors</span></a></li>
    <li><a href="http://www.YOURFORUM.com/forum/forumdisplay.php?f=4" title="Non Tech Forums"><span>Non Tech</span></a></li>
    <li><a href="http://www.YOURFORUM.com/forum/forumdisplay.php?f=1" title="Tech Forums"><span>Tech</span></a></li>
    <li><a href="http://www.YOURFORUM.com/forum/arcade.php" title="Hang out in the Arcade!"><span>Arcade</span></a></li>
    <li><a href="http://www.YOURFORUM.com/forum/" title="The main forum page!"><span>Home</span></a></li>
  </ul>
</div><br><br>


These are the basic instructions, you can use any tabs you'd like.


All times are GMT. The time now is 03:51 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01051 seconds
  • Memory Usage 1,748KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (2)bbcode_code_printable
  • (1)bbcode_php_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete