How to Disable an Element on Mobile Devices in Elementor

One the features offered by Elementor — and other page builder plugins at large — is ability to hide an element on mobile devices. The feature is especially great to implement the concept of responsive design. Since mobile devices have a smaller screen size than desktop, it is not always necessary to display all elements. Instead, you can hide some elements that not necessary (on mobile) and display only the key elements. For instance, you can hide the video on the hero section if you think it’s not necessary to be displayed on mobile devices.

Elementor allows you to hide all element types on mobile devices. Be it section, column, or widget. To hide an element, first, click the element handle to open the settings panel.

On the settings panel, go to the Advanced tab and open the Responsive block and then enable the Hide On Mobile option.

That’s all. You can preview your page to see the result. You can resize your browser window to preview the page on mobile devices as shown on the following screencast.

While Elementor only allows you to hide an element by device type, you can install Happy Addons if you need to hide an element by other parameters like user role, login status, operaing system, and browser.

This page may contain affiliate links, which help support utilizeWP.

Boost your site speed with the best caching plugin in the world

Leave a Reply

Share This