How to link to tabs

Hi,
Sorry for the late reply, please see this post.
So in your case, Try adding this code to the end of your functions.php file in Appearance > Editor:

add_action('wp_footer', 'ava_custom_script');
function ava_custom_script() {
?>
		<script>
 (function($){
            function getQueryParams(qs) {
			    qs = qs.split("+").join(" ");
			    var params = {},
			        tokens,
			        re = /[?&]?([^=]+)=([^&]*)/g;

			    while (tokens = re.exec(qs)) {
			        params[decodeURIComponent(tokens[1])]
			            = decodeURIComponent(tokens[2]);
			    }

			    return params;
			}

			var $_GET = getQueryParams(document.location.search);

            $(window).load(function() {
                switch($_GET['tabsort']) {
                    case '1':
                        $('a[data-av-tab-section-title="1"]').trigger('click');
                        break;
                    case '2':
                        $('a[data-av-tab-section-title="2"]').trigger('click');
                        break;
                    case '3':
                        $('a[data-av-tab-section-title="3"]').trigger('click');
                        break;
                    case '4':
                        $('a[data-av-tab-section-title="4"]').trigger('click');
                        break;
                    case '5':
                        $('a[data-av-tab-section-title="5"]').trigger('click');
                        break;
                }
            });
        })(jQuery);
</script>
<?php
}

and your link would look like /?tabsort=5 or /?tabsort=#waxing
If this doesn’t help, please include an admin login in the private content area so we can be of more assistance.

Best regards,
Mike

Hi,
I see that when linking directly from another page or site to https://kosmetikandnails.ch/#nails the tab opens but the page doesn’t scroll down to the tab. to correct try adding this code to the end of your functions.php file in Appearance > Editor:

function custom_id_script(){
  ?>
  <script>
(function($){
  $(document).ready(function(){
$("a.av-section-tab-title").each(function() {
   var $this = $(this);       
   var _href = $this.attr("href"); 
   var itemId = _href.substring(1, _href.length);
   $this.attr("id", itemId);
});
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_id_script');

it adds an “id” to the tab link so the page will scroll to the tab.
If the link to the tab is clicked on the same page the offset doesn’t always work so add this code to the end of your functions.php file in Appearance > Editor to apply an offset to the tabs:

function custom_offset_script(){
  ?>
  <script>
(function($){
	var width = $(window).width()
	if ((width >= 768)) {
    $('a.av-section-tab-title[href*="#"]:not([href="#"])').click(function() {
    var offset = -130; // <-- change the value here
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
        if (target.length) {
            $('html, body').animate({
                scrollTop: target.offset().top + offset
            }, 1000);
            return false;
        }
    
    }
    
});
} else {}
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_offset_script');

Best regards,
Mike

Hi,

@Guenni007 thank you, that is a good point. @KosmetikAndNails please let us know if updating and using @Guenni007 code above helps.

Best regards,
Mike