所有分类
  • 所有分类
  • WP插件Pro
  • HTML模板
  • 微信小程序模板
  • 源码

如何固定 WordPress 侧边栏/ 菜单 / 按钮? (Q2W3 Fixed Widget 浮动插件教程)

这是一篇完整 Q2W3 Fixed Widget 」固定小工具插件教程,随装随用。 启用过后,便会在各项小工具设定中,多出「固定这个小工具」选项,将该工具钉选在页面中。

有的站长,可能会有在侧边栏固定小工具需求,就可以使用插件来帮助设定。

我们将介绍这款好用的 WordPress 浮动菜单插件,如何安装+启用,并且设定固定小工具不超出指定边界,避免覆盖页尾及跑版。

  • 1. Q2W3 Fixed Widget 是什么?
  • 2. 安装+启用 Q2W3 Fixed Widget
  • 3. 固定侧边栏小工具
  • 4. 调整固定小工具上下缘边界
  • 5. 手机/平板装置,关闭固定小工具
  • 常见问题

1. Q2W3 Fixed Widget 是什么?

Q2W3 Fixed Widget for WordPress 固定小工具插件

Q2W3 Fixed Widget for WordPress 是一款 WordPress 固定小工具插件。

可以设定侧边栏、菜单,各项小工具不受滚动限制影响,持续显示于页面可见区域上。

Q2W3 可固定小工具在屏幕可见区域

有些站长可能会在侧边栏新增重要信息,例如:文章的侧边栏目录等 .. 。 更多 如何新增 WordPress 文章目录+侧边栏目录。

与未固定的小工具相比,访客会对浮动菜单/侧边栏有较多好感度,点击率与使用率都会上升。

除了固定小工具,Q2W3 Fixed Widget 也能够使广告、窗口浮动,是很方便的一款 WordPress 浮动菜单插件:)


2. 安装+启用 Q2W3 Fixed Widget

前往 WordPress 后台 > 安装插件 > 搜索 Q2W3 Fixed Widget for WordPress 插件,安装+启用。

WordPress固定小工具插件安装+启用
Q2W3 Fixed Widget 安装+启用

3. 固定侧边栏小工具

启用后,Q2W3 即可作用,帮助大家固定小工具。

前往 WordPress 外观 > 小工具,新增或点击任意小工具进行编辑,勾选“ 固定这个小工具 ”选项,保存设定。

刷新前台网站,上下滑动,发现成功固定侧边栏小工具啰:)

滑到文章最底下,发现小工具成功浮动

如果其它想固定的浮动菜单,编辑小工具,找到并选中“ 固定这个小工具”选项即可:)


4. 调整固定小工具上下缘边界

如果固定小工具过长,会浮动至页面下方,遮盖住页尾的部分,或是上边界太贴近页面,显得压迫,如下图。

页尾被浮动侧边栏覆盖

我们可以设定上下缘的边界,让小工具的上下区域,多出一些空间,并停在页尾上方,避免浮动小工具覆盖页尾跑版。

那该怎么修改呢? 具体有 2 种方法。

方法 1:修改上下边距像素

从 WordPress 后台 > Fixed Widget 选项页面,找到上边界&下边界选项,填入相对应数值。

转到 Fixed Widget 选项,调整上下边界像素( px)
  • 上边界:距离页面上方有多少像素。
  • 下边界:距离页面下方有多少像素。

设定完成后,储存变更,前往页面刷新,可以看见,因为增加上下边界的数值,所以浮动侧边栏不再覆盖页尾啰:)

设定上下边界数值,成功让浮动侧边栏停在页尾上方

小提醒:在填写“ 下边界 ”数值时,可先估算距离(像素),并进行多次对比,确认固定小工具的停止边界,是不是在自己想要的范围唷:)

方法 2:设定停止 ID

每个网页区块,都会有一个 ID,就像是人们的姓名一样,让网站可以找到该区域,进行设定。

我们可以找到页面中任意区块的ID,在Q2W3 Fixed Widget进行设定停止ID,让浮动小工具停在该指定区域的上方。

首先,在前台网页,我们对着想停止的区块,点击鼠标右键,选择“ 检查 ”打开浏览器开发者工具,找到想停留区块的“ ID ”,这边以留言区为例,复制留言区的 ID 。

打开浏览器开发者工具,复制区块 ID

复制后,前往 WordPress 后台 > Fixed Widget 选项页面,找到“ 停止 ID 」选项,贴上留言区 ID,储存设定。

将留言区ID 贴到停止ID栏位

前往前台刷新,发现固定小工具悬浮于留言区的上方啰:)

固定小工具成功停在留言区上方

5. 手机/平板装置,关闭固定小工具

在手机跟平板装置,同样也会出现固定侧边栏,这就会导致跑版的情况,如下图。

手机页尾被浮动菜单覆盖跑版
手机页尾被浮动菜单覆盖跑版

我们可以使用 Widget Options 插件,将手机 / 平板设备隐藏勾选,就能关闭固定小工具。

使用 Widget Options 插件,隐藏手机 / 平板选项

在手机 / 平板隐藏小工具后,手机 / 平板设备就不会再显示浮动窗口,而导致网页出现乱!

隐藏固定小工具成功~

常见问题

Q2W3 Fixed Widget 是什么?

Q2W3 Fixed Widget for WordPress 是一款 WordPress 固定小工具插件(常用在固定站点侧边栏)。

可以设定侧边栏、菜单,各项小工具不受滚动限制影响,持续显示于页面可见区域上。

如何固定 WordPress 侧边栏小工具?

安装 Q2W3 Fixed Widget for WordPress 后,选择启用。

接着前往 WordPress 菜单 > 小工具,打开“ 固定这个小工具 ”选项,保存设置,即可成功固定 WordPress 侧边栏小工具!

WordPress 固定小工具跑版,吃到页尾,如何处理?

电脑设备,我们可以前往 WordPress 后台 > Fixed Widget 选项页面,进行设定。

具体有2个方法:增加上下边界像素数值、找到想让浮动侧边栏停留区块,复制ID,在停止ID选项贴上。

可以参考本文提供的详细教程:)

手机/平板装置部分,我们可以使用 Widget Options 插件,分别在这两个装置,隐藏固定小工具,避免跑版。

想要调整侧边栏的文章 /商品排序,有推荐的插件吗?

Category Order and Taxonomy Terms Order 插件可以帮助网站的文章分类、商品分类进行排序,让访客可优先点击指定选项。

原文链接:https://www.itaoda.cn/blog/12111.html,转载请注明出处。

0
使用和安装有任何问题
请加客服QQ:1442071397 或wechat:pufei889


免责声明

本站所发布的部分内容自网络,该部分内容限用于学习和研究目,有版权问题的,下载后的24个小时之内,从您的电脑中彻底删除。且不得将用于商业或者非法用途,否则,一切后果请用户自负,与本站无关。

评论0

请先
没有账号?注册  忘记密码?

社交账号快速登录

× 发送
微信扫一扫

海量独立站商城

本站拥有海量商城独立站模版,涉及各行各业产品,提供免费安装部署,免费对接支付,提供物流发货解决方案,支持多语言、多币种。更多帮助,请直接在右下角联系客服

禁止将网站用于含诈骗、赌博、色情、木马、病毒等违法违规业务,本站将暂停一切售后。

温性提示

演示站服务器在国外,网站打开速度有点慢,请耐心等待

多功能、多行业外贸商城 wordpress商城WOOCOMMERCE

23+
行业模板