Docs

[Brian H]

Ive seen several posts about linking to a specific tab, is there a definitive answer on this?
I want to have a link on the same page that links to an open tab.

[Prasant Rai]

Hello Brian,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[Brian H]

My url is http://dukeblogger.com

the url with the tabs is : http://vvoice.staging.wpengine.com/test-products/

[Rupok]

Hi there,

Thanks for writing back. That’s the best solution for your case – https://community.theme.co/forums/topic/open-accordion-from-link/#post-65132

Cheers!

[Brian H]

Hey there I tried this solution but it didnt seem to work:

https://vvoice.staging.wpengine.com/test-products/

[Rupok]

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[Brian H]

This reply has been marked as private.

[Lely]

Hi Brian,

Thank you for the credentials. There’s an update in the structure of the tab that’s why the code is not working anymore. I update the code to this:

/* Open Tab from Link */
jQuery(function($){
  
  $(document).ready(function() {
    var tabnum = location.href.split("#").slice(-1)[0] ;
     x_scroll_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[data-cs-tab-toggle="' + tabnum.split("-").slice(-1)[0] + '"]') );
  });

  $('.link_to_tab').click(function(e){
    e.preventDefault();
    x_scroll_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[data-cs-tab-toggle="' + tabnum.split("-").slice(-1)[0] + '"]'));
  });

});

function x_scroll_to_tab($, tab_nav) {
            $(tab_nav).click();
	            $('html,body').animate({scrollTop: $(tab_nav).offset().top - ( $('.x-navbar').height() + 50 )},700 ,'swing');

}

It is working now. See this:http://screencast-o-matic.com/watch/cD6lVMj4gp

Cheers!

[Brian H]

The issue I’m having is that when you click on the learn more buttons it doesnt work, it works in the nav bar but I want the 4 learn more buttons to go to the open tabs.

[Lely]

Hi Brian,

Thank you for the clarification. I update the code to this:

jQuery(function($){
  
  $(document).ready(function() {
    var tabnum =  location.href.split("#").slice(-1)[0] ;
     x_scroll_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[data-cs-tab-toggle="' + tabnum.split("-").slice(-1)[0] + '"]') );
  });

  $('.enable_jump_to').click(function(e){
    var tabnum = $(this).attr('href'); 
    e.preventDefault();
    x_scroll_to_tab($, $('.x-nav-tabs .x-nav-tabs-item a[data-cs-tab-toggle="' + tabnum.split("-").slice(-1)[0] + '"]'));
  });

});

function x_scroll_to_tab($, tab_nav) {
            $(tab_nav).click();
	            $('html,body').animate({scrollTop: $(tab_nav).offset().top - ( $('.x-navbar').height() + 50 )},700 ,'swing');

}

See this:http://screencast-o-matic.com/watch/cD6l6Ej4sy
Add the href value for the button under statevoice and localvoice button for it to work there.

Hope this helps.

[Brian H]

THANK YOU!! you guys are the best!!

[Joao]

Glad to hear we managed to help,

Joao

[Author]

Posts