Support » Plugin: Tabs » Link to a specific tab

  • Resolved garweld

    (@garweld)


    Hi,

    I’ve recently installed your tabs plugin and it seems to work great for what I’m using it for. I’ve run into an obstacle though. I have a set of tabs on one page. In each of these tabs, I have a link to an FAQ for that particular tab’s content. For example, say the 2nd tab is “Cars” and the FAQ link takes you to another page called “/FAQs” and the Car FAQ tab is tab number 3 on this FAQs page.

    What I am looking to do is when you’re on the Cars tab on the homepage, and you click an FAQ link that takes you to the “/FAQs” page, tab 3 is open. I’d like to duplicate this behavior for all tabs.

    I looked through the answers here and I saw a couple that mentioned a modification using jQuery, but I don’t understand it.

    Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support preetam27

    (@preetam27)

    hi @garweld ,

    you can link using anchor tag to open another tab by doing these steps.

    1.install Insert Script In Headers And Footers plugin.
    2.you can find it in settings>Insert Script In Headers And Footers and paste the following script in “Scripts in Footer” textarea.

    <script type=”text/javascript”>
    jQuery(function () {
    jQuery(‘.tabcall’).on(‘click’, function(event) {
    event.preventDefault();
    var tabid = jQuery(this).attr(‘tab-id’);
    jQuery(‘[data-toggle=”tab”][href=”#’ +tabid + ‘”]’).trigger(‘click’);
    })
    });
    </script>
    3.now copy and paste following code in tab description

    for example:-

    link
    you have to just change the tabs_desc_143_2 last digit of id according to your tabs sequence eg. tabs_desc_143_3 and run the It.if it doesnt work then let me know..

    Thanks..

    Thanks for the follow up.

    I didn’t install the plugin, but I added your script code to my footer.php file, before the closing body tag.

    My link looks like the following:

    <a href="/bgs-faqs/#tabs_desc_1723_4" onclick="ga('send','event','BGS FAQs','/bgs-faqs')"><div class="bgsel-faqs hvr-float">
    <i class="fa fa-question-circle" aria-hidden="true" style="color:#2a7f97; font-size:3.75em;"></i>FAQs</div></a>

    Unfortunately, when I click on that link, it takes me to the FAQs page where my tabs are, but it’s not taking me to the 4th tab’s content. It just opens the page and the 1st tab shows by default.

    Plugin Support preetam27

    (@preetam27)

    hi @garweld ,

    add <a tab-id="tabs_desc_143_2" class="tabcall" data-toggle="tab">link</a>

    in tab description

    you have to just change the tabs_desc_143_2 last digit of id according to your tabs sequence eg. tabs_desc_143_3 and run the It.if it doesnt work then let me know..

    thanks.

    Adding that code made the link unclickable. I found an alternative method to achieve what I am looking for though, so we can lay this conversation to rest.

    Plugin Support preetam27

    (@preetam27)

    hi @garweld ,

    you may not be doing like that..but its good if you resolve it..

    thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.