如何在移动设备上隐藏 WordPress 小部件(初学者易于使用)

您想为移动用户隐藏特定的 WordPress 小部件吗?

小部件是动态内容,通常添加在网站侧边栏或页脚中.有时,小部件在台式机/笔记本电脑设备上可能看起来不错,但您可能希望在移动设备上隐藏它.

在本文中,我们将向您展示如何在移动设备上有条件地隐藏 WordPress 小部件(无需编写任何代码).

Hiding a WordPress widget on mobile devices

注意:在大多数响应式 WordPress 主题中,侧边栏将显示在移动设备上的内容下方.这就是为什么网站所有者经常希望在移动设备上隐藏某些小部件以加快移动用户的网站速度.

如何在 WordPress 中隐藏移动设备上的小部件

为了本教程,我们将在演示站点上隐藏搜索小部件,但您可以使用它来隐藏任何 WordPress 小部件.

在我们的演示站点上,搜索小部件显示在侧边栏的顶部,在桌面上看起来不错.

The widgets showing in the sidebar on a desktop

但是在手机上,侧边栏小部件显示在内容下方而不是旁边:

The search widget displaying beneath the content on mobile

我们将隐藏"搜索"小部件,使其仅显示在桌面设备上,而不显示在移动设备上.

注意:在本教程中,术语"台式机"包括笔记本电脑和普通台式机.

首先,您需要安装并激活小部件选项插件.有关更多详细信息,请参阅有关如何安装 WordPress 插件的分步指南.

激活后,转到外观» WordPress 管理区域中的小部件页面.

The widgets section of the WordPress admin

在此屏幕上,您会看到您的活动小部件放置在您网站的小部件就绪区域中.

让我们继续并通过单击小部件的名称来编辑搜索小部件:

Expand your widget to view the options

在小部件设置上,您会看到小部件选项插件添加的新部分.在这里,只需点击移动小图标,然后选择要隐藏小部件的设备.

Hiding a widget on mobile and tablet devices

不要忘记点击"保存"按钮来保存您的更改.

现在,请继续使用移动设备查看您的网站.该小部件将不再出现在您的小部件区域中:

The search widget is now gone from the mobile version of the website

但是,如果您想在桌面设备上隐藏小部件但在移动屏幕上显示它怎么办?

让我们来看看如何做到这一点.

如何在 WordPress 中制作移动版小部件

有时,您可能希望为桌面访问者提供一个小部件版本,为移动访问者提供一个不同的版本.

例如,您可能希望在桌面设备上显示最近的五篇帖子,但在移动设备上只显示三篇帖子.

使用小部件选项插件也很容易做到这一点.您可以简单地创建两个小部件,并将一个小部件设置为仅在桌面上显示,另一个仅在移动设备上显示.

首先,添加或打开您只想在桌面上显示的小部件.然后,单击小移动图标.之后,只需选中"平板电脑"和"移动设备"框即可隐藏这些设备上的小部件:

Displaying a widget on desktops only

不要忘记按"保存"按钮来保存您的更改.

现在,添加或打开您只想在移动设备上显示的小部件.重复相同的过程,但这次,单击"桌面"复选框以隐藏桌面设备上的小部件:

Showing a WordPress widget on mobile devices but not on desktops

就是这样.您现在拥有小部件的桌面版本和移动版本.

我们希望本文能帮助您了解如何在 WordPress 中隐藏移动设备上的小部件.您可能还想查看我们的最佳拖放式 WordPress 页面构建器列表来自定义您的网站,或者如何在 WordPress 中创建自定义主题(无需编写任何代码).

4

发表回复