WordPress知识分享

如何使用 Elementor 菜单锚点小部件

Elementor 菜单锚点小部件(Menu Anchor Widget)与 WordPress 锚链接功能是类似的。本意是从当前位置跳转到当前页面的某个位置或者其他页面的某个位置(前者用的多)。对此功能还不了解的朋友请移步看相关内容:WordPress添加锚点定位如何给古腾堡编辑器添加HTML锚链接,先从这两篇文章中了解基础名词知识,再来查看本文。

比如一个外贸展示网站,在 banner 位置放一个“联系我们”的按钮,点击后跳转到本页面最下面的联系我们表格处。

又比如你的文章内容较长,在文章开头用锚点添加很多 H2标签(也可以用 WordPress目录插件实现),用户可以按需点击直接跳转到感兴趣的内容中,省的用鼠标上下滑动无法快速定位想看的内容,对用户体验不好。如果想做成目录还是直接用 WordPress 目录插件:LuckyWP Table of Contents插件Easy Table of Contents插件更合适。

Elementor页面编辑器 点我直达 Elementor pro插件官网,快速建站,容易上手。入门点击购买Elementor Pro插件和下载安装激活_WordPress页面编辑器。 更多Elementor插件内容请看Elementor专题
学习、小网站选择 1核2g配置的服务器起步,国外主题建站选择 2核4g配置,适当搭配运行流畅。
国内服务器:阿里云腾讯云(都有代金券,付款时抵用省钱) 不知道如何选择地域、配置请在页面右侧+老魏的联系研究。
外贸、B2C/C2C等网站在国外注册域名。打开namesilo官网,在搜索框里输入并选择好后注册,记得使用优惠码省钱。优惠码点击国外域名商Namesilo域名注册教程获取。
外贸网站建议选择Hostinger虚拟主机,价格便宜,性价比极高!Hostinger专题
SiteGround虚拟主机价格适中服务好!SiteGround专题

菜单锚点是 Elementor免费版就提供的功能,如果你还需要更多功能可以考虑购买 Elementor pro版本。太多版本不知道如何选择?请看 Elementor页面编辑器计划套餐有哪些及如何选择

按钮跳转菜单锚点

1、打开一个文章或页面,新建一个段,如下图所示在左侧搜索“锚”或 anchor,看到“菜单锚点”。

在左侧搜索“锚”或 anchor,看到“菜单锚点”,拖拽到右侧要定位的目标区域。

2、在页面添加一个按钮,拖拽“菜单锚点”到右侧要定位的目标区域,比如联系表单,如下图所示。中间的空白区域代表很多个图片、banner、内容等。

拖拽的时候注意:你想让跳转到哪里,就拖拽到哪里松手。只有背景出现蓝色才可以松开鼠标,代表着添加成功了。

在页面添加一个按钮,拖拽“菜单锚点”到右侧要定位的目标区域

3、点击菜单锚点,在左侧命名一个 ID,要唯一不能重复的。ID值前面不用加 # 符号。

ID 不带空格,只能用字符:A-Z, a-z, 0-9, _ , - 等。

点击菜单锚点,在左侧命名一个 ID,要唯一不能重复的

4、点击按钮,或者你打算作为目录的那段话,左侧链接处添加 #ID,ID就是上面你命的名字,前面必须加 #。

4、点击按钮,或者你打算作为目录的那段话,左侧链接处添加 #ID,ID就是上面你命的名字,前面必须加 #。

5、点击上面的按钮后,页面就跳转到锚点(联系表单)上了。

自定义菜单跳转锚点

1、在 WordPress后台添加一个名为 home的页面,去设置 > 阅读设置“您的主页显示”> 主页为刚新建的 home页面。

2、在 WordPress后台 > 外观 > 菜单,右侧打开自定义链接,URL:#mudidi,链接文字:菜单锚点或者随便什么名字都行,我是为了方便讲解,或者别的名字,点击【添加至菜单】按钮。

在 WordPress后台 > 外观 > 菜单,右侧打开自定义链接,URL:#mudidi

3、把这个自定义菜单上下拖拽放到合适位置,如下图所示。

把这个自定义菜单上下拖拽放到合适位置,如下图所示

4、去网站首页刷新页面后,看到菜单栏中的自定义链接菜单,点击后跳转到当前页面下面的锚点处(联系表单)。

使用 Elementor 菜单锚点可以快速建立起页面内部跳转关系,操作起来和 WordPress锚点链接几乎相同。只要分清楚 ID命名和 # 使用就行了。就能让访客在当前页面上快速的定位到自己要的位置,也就是在当前页面的不同内容位置的引导链接,从而提高访客体验和增加 SEO效果。

赞(4)
文章名称:《如何使用 Elementor 菜单锚点小部件》
文章链接:https://www.vpsss.net/26567.html
版权声明:本站资源仅供个人学习交流,禁止转载,不允许用于商业用途,否则法律问题自行承担。
图片版权归属各自创作者所有,图片水印出于防止被无耻之徒盗取劳动成果的目的。