Anchor Link Positioning is Off

Hey James,

Thank you for the inquiry.

The home page loaded correctly on our end, but the subpages didn’t — they showed a broken layout with no styles. Have you installed any third-party compression plugins? Please disable the cache and compression plugins temporarily.

Best regards,
Ismael

Hi,
I added this function in your child theme functions.php to allow your page to fully load, and then scroll to anchor so the height of elements while loading doesn’t change the anchor possession.

function custom_slow_scroll_script() { 
?>
<script>
(function($) {
  $('a[href*=#]:not([href=#])').click(function() {
    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 - 125 //offsets for fixed header
        }, 2000);
        return false;
      }
    }
  });
  //Executed on page load with URL containing an anchor tag.
  if($(location.href.split("#")[1])) {
      var target = $('#'+location.href.split("#")[1]);
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top - 125 //offset height of header here too.
        }, 2000);
        return false;
      }
    }
}(jQuery));
</script>
<?php
}
add_action('wp_footer', 'custom_slow_scroll_script');

This seems to work in my tests, please clear your browser cache and check.
Please note that some browsers may require you to clear the history in order to fully clear the cache.

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike