Linking a button to a specific tab in a tabs menu

I didn’t find the custom code you posted, on your site. Anyway this would be incorrect, as that is for linking to tabs in another page.

I saw this on your published site though (do note that custom code only works on published sites):

<script>
  $('.custom-button').on('click', function (evt) {
    $('.target-tab-link').triggerHandler('click');
    evt.preventDefault();
  });
</script>

This is almost correct, however your classes custom-button and target-tab-link are not unique.

You need custom-button-1, custom-button-2, custom-button-3, custom-button-4 buttons,

then target-tab-link-1, target-tab-link-2, target-tab-link-3, target-tab-link-4,

then copy that custom code 4 times like this for each button/tab link pair:

<script>
  $('.custom-button-1').on('click', function (evt) {
    $('.target-tab-link-1').triggerHandler('click');
  });
  $('.custom-button-2').on('click', function (evt) {
    $('.target-tab-link-2').triggerHandler('click');
  });
  $('.custom-button-3').on('click', function (evt) {
    $('.target-tab-link-3').triggerHandler('click');
  });
  $('.custom-button-4').on('click', function (evt) {
    $('.target-tab-link-4').triggerHandler('click');
  });
</script>
4 Likes