Streaming live at 10am (PST)

Solution - creating an URL link for a specific tab

Hi all,

I needed a solution for creating an URL link for a specific tab, i found other solutions like Accessing tabs from address bar or Linking to Specific Tab from another Link or Button but i needed a specific separate url for each tab.
Then I found this solution How to create a link to a specific tab? , (thanks a lot @design) and improved it a bit because it didn’t work well for me :).

So here you have an improved solution:

<script>
$( function() {
    function changeTab() {
        var tabName = window.location.hash.substr(1);
        var tabEl = $('[data-w-tab="' + tabName + '"]');
        if (tabEl.length) {
            tabEl.click();
        }
    }

    //when page is first loaded
    if(window.location.hash){
        changeTab();
    }

    //internal page linking
    $(window).on('hashchange', changeTab);

    $('[data-w-tab]').on('click', function(){
        history.pushState({}, '', '#'+$(this).data("w-tab"));
    });
});
</script>

How to use it:

  • add the code in Before body tag of the needed page
  • rename the tab1, tab2, tab3, etc. in the Element Settings panel, Tab Settings with the custom name you want to have in the URL.

Aaaaand, done :slight_smile:
I hope this will help you!