How to Control Which Widgets Appear on Mobile or Desktop in WordPress

A short tutorial on how to enable or disable WordPress widgets selectively for mobile and desktop devices.

LEVEL: BEGINNER TIME: A FEW MINS

 

Why to display widgets selectively?

Although widgets provide a lot of features and make it easier for users to interact with your website, sometimes you want to be able to have different widgets appear on mobile or desktop devices. There are several reasons to do so. Some of them are as follows.

  • Appearance
    Desktop view has enough space for widgets, whereas mobile view often doesn’t. So it’s likely that widgets would appear differently and occupy more space on smaller devices. In such case, it’s better to adjust widgets instead of spoiling the look of website for audience.
  • Purpose
    All widgets exist to serve a purpose. But, at times, certain desktop widgets might not be usable on mobile and vice-versa. Therefore, it’s necessary to control them accordingly depending on their suitability. For example, a sidebar image widget containing text might seem too small on mobile to be readable.
  • Importance
    Audiences have shorter attention spans. In desktop view, widgets appear fine and get some attention. But it’s not the same for mobile, because users don’t prefer scrolling so many widgets instead of reading the actual content. You need to decide which widgets are important to your audience and then display those.

Not only these, but skillfully customizing widgets based on widget-type, content, audience, and other factors is always a better choice than purposelessly displaying everything on your website without a goal or confusing or audience.

How to adjust which widgets appear on mobile or desktop in WordPress

WordPress gives you options to control which widgets appear on desktop or mobile view. Here’s how to do it.

You can browse or add new widgets through your WordPress dashboard by selecting Appearance > clicking on Widgets option, where all the widget options are available.

Though you’ll find that while there are options to change widget name, position and visibility, there aren’t many customization options.

This limitation can be overcome using certain WordPress plugins which can help you make several tweaks to your blog widgets.

Using Pojo Device Widget plugin

It’s probably the simplest plugin to enable/disable widgets for devices.

Install and activate the plugin, after which new widget option to Show/Hide Widget would appear for all the widgets.

You can use this option to select whether certain widgets should appear on selected devices or not.

For instance, if you want to disable a widget for mobile then click on the widget for options > click on Show/Hide Widget option > and select Hidden Phone, after which the widget won’t appear on mobile devices anymore.

Also, the process is the same for desktop and tablets.

Using Restrict Widgets plugin

Restrict Widgets is a simple plugin which adds options to control the appearance of widgets on various devices, blog pages, and to which users they should be displayed.

Install and activate the plugin after which the plugin related customization options would appear for widgets.

Now, you can decide which widgets show up on your blog on various devices.

For example, to disable a widget on Mobile, click on the Display/Hide Widget options > select Hide widget on selected > scroll and select Mobile below Devices section > and Save.

The widget won’t appear on mobile devices anymore.

You can also control whether the widget should appear on certain pages, for posts of a particular category, and on different generic pages.

This functionality helps you make your widgets as relevant as possible for the audience.

Also, you can go to Settings > and click on Restrict Widgets to prevent widgets from appearing at some selected positions on blog, and to restrict widgets to blog users.

Using Widget Options plugin

Widget Option is probably one of the most powerful widget related plugins in WordPress. It provides more control over your widgets, and comes with optional premium features as well. However, most of its main features are free.

Install and activate the plugin.

Doing this would make additional widget customization options appear right in the existing widget options which you can access by clicking on Appearance > Widgets.

Using these options, you can select whether you want the widget title to appear, in which devices it should show up, and choose other preferences based on your need.

For example, if you want to disable a widget on mobiles then click on widget name > go to the Devices option (mobile icon) > select Hide on checked devices > check Mobile > click Save.

Now the selected widget won’t appear on mobile anymore. You can make similar customization for desktop and tablet devices for all other widgets as well.

Also, you configure all the plugin related options by selecting Settings > and clicking on Widget Option.

BACK TO TUTORIAL ARCHIVE

Scroll Up