Question

我的主菜单中有一个锚点链接到我主页上的联系表格，当你从另一页去那里时，＆＃34;汉堡包＆＃34;图标变得无法点击。

我正在使用＆＃34; Shapely＆＃34; wordpress的主题，我相信它有一个bug。我已经在他们的支持论坛上询问过但没有回答。

如果您访问演示网站并在移动视图上添加指向网址的锚点链接并尝试点击菜单（它不起作用），您可以看到我正在谈论的内容。

https://colorlib.com/shapely/#any-id

我需要一个解决方法。我该怎么办？

Answer 1

文件中出现javascript错误，名为shapely-scr‌ipts.js。 javascript在一个文件/ <script></script> tags中停止执行位于错误之后的代码。

在您的情况下，保存所有主题js函数和修复错误的方法是：

<强> 1。第一种方式：

修改主题的.js文件。即使在修改后，如果您更新主题，您也会丢失所做的所有更改。以下是您需要更改的内容：

使用{your-website-folder}/wp-content/themes/shapely/assets/js/转到file manager/ftp connection并找到shapely-scr‌ipts.js文件。在该文件中找到此代码后

// Smooth scroll
if ( '' !== window.location.hash ) {
  element = $( '#site-navigation #menu a[href=' + window.location.hash + ']' );
  if ( element ) {
    scrollToID = '#' + element.data( 'scroll' );
    $( 'html,body' ).animate( {
      scrollTop: $( scrollToID ).offset().top
    }, 2000 );

    newURL = window.location.href.replace( window.location.hash, '' );
    window.history.replaceState( {}, document.title, newURL );

  }
}

它从第24行开始并在第36行进入，并替换为这一行：

if ('' !== window.location.hash) {
    element = $('#site-navigation #menu a[href=' + window.location.hash + ']');
    if (element.length > 0) {
        scrollToID = '#' + element.data('scroll');
        $('html,body').animate({
            scrollTop: $(scrollToID).offset().top
        }, 2000);
    }else {
        element = $(window.location.hash);
        if (element.length > 0) {
            $('html,body').animate({
                scrollTop: $(element).offset().top
            }, 2000);
        }
    }

    newURL = window.location.href.replace(window.location.hash, '');
    window.history.replaceState({}, document.title, newURL);
}

更改后，您的主题js文件将无任何错误地工作，这意味着汉堡包菜单也可以正常工作。

<强> 2。第二种方式（如果你正在使用儿童主题）：

在您的子主题的某个文件夹中复制名为shapely-scr‌ipts.js的文件（在选项1中提及）。使用复制的文件shapely-scr‌ipts.js（在您的子主题中）对选项1 中描述的更改进行更改。在此之后，您需要阻止加载父主题中的文件，而不是从子主题加载文件。这将始终加载您更改的文件，即使您更新父主题

在URL上直接使用锚链接时，无法点击移动菜单

1 个答案: