WordPress Twitter Bootstrap CSS
[resolved] Cannot link to tab (4 posts)

  1. bennygill
    Posted 2 years ago #


    I've got the plugin installed and setup a tabbale nav on my wordpress post. This is what the code looks like:

    <div class="tabbable tabs-left">
    <ul class="nav nav-tabs">
    	<li class="active"><a href="#tab1">tab1</a>
    <li><a href="#tab2">tab2</a></li>
    <div class="tab-content">
    <div id="tab1" class="tab-pane active">
    Content of Intro tab...
    <div id="tab2" class="tab-pane">
    Content of middle tab...
    <a href="#tab1">LINK TO TAB 1</a>

    What I need is for a way to link to each tab. So if I'm in tab2 I want a way to link back to tab1 so that when it is clicked the page opens tab1.

    So I created a href to #tab1 but nothing happens when I click the link. The URL in my browser bar changes to http://www.examplesite.com/#tab1 but the webpage stays the same, nothing happens.

    What am I doing wrong?


  2. Paul G.
    Plugin Author

    Posted 2 years ago #

    Hi Benny,

    You're not doing anything wrong... this is a javascript/bootstrap issue in that this behaviour isn't actually supported.

    Try adding this javascript to your page:

    <script type="text/javascript">
    	$( document ).ready(
    		function() {
    			$( 'a[rel=tab-shortcut]' ).on( 'click',
    				function() {
    					var $oThis = $( this );
    					var $oSearch = $( '.nav-tabs a[href="'+$oThis.attr('href')+'"]' );
    					if ( $oSearch.length > 0 ) {
    						$oSearch.tab( 'show' );

    In the link you create in html it has to contain the following:
    <a href="#yourTabId" rel="tab-shortcut">Link text</a>

    The important part here is the rel="tab-shortcut". Without it, the javascript above wont fire.

    Let me know if that helps.

  3. bennygill
    Posted 2 years ago #

    Thanks for the help Paul.

    I tried that code but it didn't work :(

  4. Paul G.
    Plugin Author

    Posted 2 years ago #

    Can you give me the exact code/html you used?

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WordPress Twitter Bootstrap CSS
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic


No tags yet.