wordpress移动_如何在移动设备上隐藏WordPress小部件（易于初学者使用）

wordpress移动

Do you want to hide a specific WordPress widget for mobile users?

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

Widgets are dynamic content that are often added in the website sidebar or footer. Sometimes a widget may look good on desktop / laptop devices, but you may want to hide it on mobile devices.

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

In this article, we’ll show you how to conditionally hide a WordPress widget on mobile devices (without writing any code).

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

Note: In most responsive WordPress themes, the sidebar will appear below your content on mobile devices. This is why often website owners want to hide certain widgets on mobile to speed up their website speed for mobile users.

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

如何在WordPress中隐藏移动设备上的小部件 (How to Hide a Widget on Mobile in WordPress)

For the sake of this tutorial, we’ll be hiding the search widget on our demo site, but you can use it to hide any WordPress widget.

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

On our demo site, the search widget appears at the top of our sidebar, and it looks fine on desktop.

在我们的演示站点上，搜索小部件出现在侧边栏的顶部，在桌面上看起来不错。

However on a mobile phone, the sidebar widgets display below the content instead of alongside it:

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

We are going to hide the Search widget so that it only displays on desktops, and not on mobile devices.

我们将隐藏“搜索”小部件，使其仅显示在台式机上，而不显示在移动设备上。

Note: In this tutorial, the term ‘desktops’ includes laptops as well as regular desktops.

注意：在本教程中，术语“台式机”既包括笔记本电脑，也包括常规台式机。

First, you need to install and activate the Widget Options plugin. For more details, see our step by step guide on how to install a WordPress plugin.

首先，您需要安装并**Widget Options插件。 有关更多详细信息，请参阅有关如何安装WordPress插件的分步指南。

Upon activation, go to the Appearance » Widgets page in your WordPress admin area.

**后，转到WordPress管理区域中的外观»小部件页面。

On this screen, you’ll see your active widgets placed in the widget-ready areas of your website.

在此屏幕上，您将看到活动的窗口小部件放置在网站的窗口小部件就绪区域中。

Let’s go ahead and edit the Search widget by clicking on the name of the widget:

让我们继续，通过单击小部件的名称来编辑“搜索”小部件：

On the widget settings, you’ll see a new section added by the Widget Options Plugin. Here, simply click on the small mobile icon, then choose which device or devices you want to hide the widget on.

在窗口小部件设置上，您将看到“窗口小部件选项插件”添加的新部分。 在这里，只需单击小型移动图标，然后选择要在其上隐藏小部件的设备。

Don’t forget to click on the ‘Save’ button to save your changes.

不要忘记单击“保存”按钮以保存您的更改。

Now, go ahead and check out your site using a mobile device. That widget will no longer appear in your widget area:

现在，继续并使用移动设备检查您的站点。 该小部件将不再出现在您的小部件区域中：

But, what if you wanted to hide a widget on desktop devices but display it on mobile screens?

但是，如果您想在桌面设备上隐藏小部件而在移动屏幕上显示该小部件怎么办？

Let’s take a look at how to do that.

让我们看看如何做到这一点。

如何在WordPress中制作小部件的移动版本 (How to Make a Mobile Version of a Widget in WordPress)

Sometimes, you might want to have one version of a widget for desktop visitors and a different one for mobile visitors.

有时，您可能想要为桌面访问者提供一个版本的小部件，为移动访问者提供一个版本。

For example, you might want to show your five most recent posts on desktop, but only three posts on mobile devices.

例如，您可能想在台式机上显示五个最新帖子 ，但在移动设备上仅显示三个帖子。

That’s also easy to do with the Widget Options plugin. You can simply create two widgets and set one widget to display only on desktop, and the other to only display on mobile devices.

使用Widget Options插件也很容易做到。 您可以简单地创建两个窗口小部件，并将一个窗口小部件设置为仅在桌面上显示，而另一个窗口小部件仅在移动设备上显示。

First, add or open the widget that you only want to display on the desktop. Then, click the small mobile icon. After that, simply check the ‘Tablet’ and ‘Mobile’ boxes to hide the widget on those devices:

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

Don’t forget to press the Save button to save your changes.

不要忘记按“保存”按钮来保存更改。

Now, add or open the widget that you only want to display on mobile devices. Repeat the same process, but this time, click the ‘Desktop’ checkbox to hide the widget on desktop devices:

现在，添加或打开只想在移动设备上显示的小部件。 重复相同的过程，但是这次，单击“桌面”复选框以隐藏桌面设备上的小部件：

That’s it. You now have a desktop version and a mobile version of your widget.

而已。 您现在拥有桌面版本和窗口小部件的移动版本。

We hope this article helped you learn how to hide a widget on mobile devices in WordPress. You might also like to check out our list of the best drag & drop WordPress page builders to customize your site, or how to create a custom theme in WordPress (without writing any code).

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

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

如果您喜欢这篇文章，请订阅我们的YouTube频道 WordPress****。 您也可以在Twitter和Facebook上找到我们。

翻译自: https://www.wpbeginner.com/wp-tutorials/how-to-hide-a-wordpress-widget-on-mobile/

wordpress移动