Issues with anchor links in one-page navigation (Wordpress 5.6, X-Theme, Ethos)

Hi there,

after upgrading to Wordpress 5.6 I am experiencing issues with one-page navigation (anchor links) in X-Theme Ethos stack. When clicking on a menu item it should lead me to a certain section of the page but instead I get redirected to top of the page.

The navigation anchor links work fine if I use jQuery Migrate Helper plugin. There are no errors reported in browser console (Chrome and Firefox) and no depreciation reported in jQuery Migrate Helper logs. I had similar anchor link issues with other WP pages built on other themes when upgrading to Wordpress 5.6. These issues were eventually solved by theme developers rolling out new theme versions with a fix.

I tried deactivating all plugins, clearing cache, disabling CDN etc. but the problem persists.
My Cornerstone version is 5.0.11.

Thanks for your help.


Hello @ovensaso,

Thanks for writing to us.

It might be the issue of plugin conflict or JS/CSS customization. I would suggest you troubleshoot with a few of the common issues before we investigate your settings.

  1. Testing for Plugin Conflict
  2. CSS/JS Customization
  3. Version Compatibility
  4. Disabling Cache
  5. Child Theme

If none of those work, please share your details in a secure note. Please provide the following details

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts




the anchor links problem was indeed caused by JS custom code (no error notification in browser console). It was inserted to automatically close mobile navigation after user taps on menu and was suggested by Themeco developers few years ago. It worked great.
If I remove the code, the desktop navigation works without jQuery Migrate Helper, but the animation is much slower than before. Also the mobile menu does not automatically close after tap.

Would it be too much trouble for you to check/rewrite the code below so it works in Worpdress 5.6.?

Thank you.

jQuery(document).ready(function($) {

var $body = $(‘body’);
var bodyHeight = $body.outerHeight();
var adminbarHeight = $(’#wpadminbar’).outerHeight();
var navbarFixedTopHeight = $(’.x-navbar’).outerHeight();
var locHref = location.href;
var locHashIndex = locHref.indexOf(’#’);
var locHash = locHref.substr(locHashIndex);
var dragging = false;

$body.on(‘touchmove’, function() {
dragging = true;
} );

$body.on(‘touchstart’, function() {
dragging = false;
} );

// Calculate the offset height for various elements and remove it from
// the element’s top offset so that fixed elements don’t cover it up.

function animateOffset( element, ms, easing ) {
$(‘html, body’).animate({
scrollTop: $(element).offset().top - adminbarHeight - navbarFixedTopHeight + 1
}, ms, easing);
return false;

// Page load offset (if necessary).

$(window).load(function() {
if ( locHashIndex !== -1 && $(locHash).length ) {
animateOffset(locHash, 1, ‘linear’);

// Scroll trigger.

$(‘a[href*="#"]’).off(‘touchend click’).on(‘touchend click’, function(e) {
href = $(this).attr(‘href’);
notComments = href.indexOf(’#comments’) === -1;
if ( href !== ‘#’ && notComments ) {
var theId = href.split(’#’).pop();
var $el = $(’#’ + theId);
if ( $el.length > 0 ) {

    if (dragging) {
    animateOffset($el, 850, 'xEaseInOutExpo');
	if(!$('.x-nav-wrap-mobile').hasClass('.x-collapsed')) {
	return false;


Hey @ovensaso,

Yes, this would be possible using custom development. However, as this would represent a customization of the theme rather than a problem with the native controls of the theme, it is beyond the scope of support.

Should you with to pursue a coded solution, then I would suggest that you consult with a developer. Alternatively, you may wish to consider our One service, where we handle customization questions.

Thanks for understanding.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.