如何解决移动设备上 Elementor 的滚动到锚点问题

Elementor是一款流行的 WordPress 页面构建器插件，允许用户在没有任何编码知识的情况下创建令人惊叹的交互式网站。它的众多功能之一是能够创建滚动到页面上特定部分的锚链接。然而，一些用户报告了这些锚链接在移动设备上无法正常工作的问题，这可能会让网站所有者和访问者感到沮丧。

如果您遇到此问题，请不要担心！有多种解决方案可以帮助您解决Elementor在移动设备中的滚动到锚点问题。在本指南中，我们将探讨一些最有效的方法来排查和解决此问题，包括调整网站设置、使用自定义代码和安装插件。通过这些提示和技巧，您将能够确保网站的锚链接在所有设备上顺利、无缝地工作，为访问者提供更好的用户体验。

在 Elementor 中，什么是锚点？

跳转菜单是锚菜单的别称。该锚点 ID 将引导您到达您指定为首选项的位置。锚点菜单使您的查看者能够导航到下一页、单击任何链接并进行任何搜索。一般来说，这是 WordPress 网站的运营商。

在网站上使用锚点可以如何帮助您

一个锚可以有多种用途。此链接可优化您网站上的冲浪体验。优点如下：

改善用户体验

锚链接方便浏览。您的访客只需单击、点击并选择所需的服务即可。这改善了在线体验。

允许您返回内容顶部

如果您滚动太多，锚链接可能会帮助您转到页面顶部。该工具将节省您的时间并让您步入正轨。

确保高效浏览

除了滚动之外，锚链接还可以用于点击、返回上一页等，方便高效浏览。

更快的性能

您可以立即从命令中获得响应。锚链接无需输入指令，可实现更快的导航。

为什么 Elementor 的滚动到锚点功能在移动设备上不起作用

很难解释为什么Elementor中的滚动锚定功能在移动设备上不起作用。但经过全面调查，我们确定了以下事实：

目标不足

如果您的页面缺少目标链接，例如 Sobre-Agencia、Como-Fazer、服务、联系人等。这可能是阻止您的滚动链接发挥作用的一个因素。

扩展造成困难

如果您的 Android 设备加载了扩展程序，这也可能会阻止滚动功能运行。

插件太多

如果您的网站有过多的插件，这可能是您的 WordPress 锚点停止响应的另一个原因。其他插件相互冲突。这可能会导致您的网站无法访问。

服务器状况不佳

如果您网站的服务器无法处理插件，这可能是导致您的链接无法运行的原因。

修复 Element 或 Scroll toAnchor 的 5 个最有效技巧

尽管 Elementor 滚动到锚点无效，但以下提示将帮助您修复网站。开始;

创建目标

如果您的页面没有目标链接，您的滚动链接可能不起作用。因此，您需要首先构建目标链接，然后按以下方式强调它们：

首先，选择您的主题并将以下代码输入到您的工作表中。

.menu-item a{
     Color: black;


}

如果您想了解您的链接是否对受众可见，请选择此选项。为此，请提供以下 CSS：

.menu-itema.mPS2id-highlight{
      color: red;
}

使用 JavaScript 过滤器

对于 Elementor 锚点小部件，可以使用 JavaScript 过滤器。运行以下程序来添加过滤器：

add_action( 'wp_footer', function() {
    if ( ! defined( 'ELEMENTOR_VERSION' ) ) {
        return;
    }
    ?>
    <script>
        jQuery( function( $ ) {
            $( window ).on( 'elementor/frontend/init', function() {

                elementorFrontend.hooks.addFilter( 'frontend/handlers/menu_anchor/scroll_top_distance', function( scrollTop ) {
                    var isMobile = $(window).width() <= 760;
                    if (isMobile) {
                        return scrollTop - 1000;
                    } else {
                        return scrollTop;
                    }   
                } ); 
            } );
        } );
    </script>
    <?php
} );

调整滚动

作为替代解决方案，在移动模式下打开菜单时调整偏移滚动。

防止菜单关闭

尽管这不是一个可行的解决方案，但唯一的选择是保持菜单栏下拉菜单打开。如果您的滚动锚被卡住，这将有助于导航。

选择默认主题

要修复网站上的锚点图标，您可以做的一件事就是修复该图标。选择 WordPress 的默认主题。这是优越的。

如何使用插件轻松将锚点添加到您的 Elementor 网站

插件是向网站添加锚链接的最方便的方法。要添加锚点，请按照以下步骤操作：

在添加任何链接之前安装链接添加插件。然后，构建一个短代码块，其中应出现锚链接。执行以下短代码：

[ps2id id='section-1'/]

将锚链接插入全新的短代码块中。将其放在您希望链接出现的任何位置。执行以下代码：

[ps2id url='#some-id']link text[/ps2id]

然后，将“some-id”替换为构造的锚点名称，并将链接文本替换为所需的锚点。立即保存更改。你已经完成了。

5个最佳锚点和滚动插件

有数十个插件可以极大地提高连接的可访问性。经过全面调查后，我们提出下面列出的五个最好的锚定插件。

包起来

每个网站所有者都希望拥有一个功能齐全的 WordPress 网站。如果它无法正常运行，您的用户可能会感到失望。 Elementor无法在移动设备上滚动到锚点是每个网站所有者遇到的常见问题。为了简化您的生活，我们重点介绍了最有效的技巧。我们相信这些信息将帮助您修复您的设备。