Responsive Control is a free Ultimate Blocks extension that lets you hide any Ultimate Blocks block on desktop, tablet or mobile screens. Use it to keep pages clean on small screens or to show a different version of a block on each device.
| Where to find it | Block sidebar, Settings tab (gear icon), Responsive Control panel |
| Plan | Free |
| Works with | All Ultimate Blocks blocks |
| Options | Hide On Desktop, Hide On Tablet, Hide On Mobile |
What you need #
- The free Ultimate Blocks plugin, installed and active.
- The Responsive Control extension turned on. It is on by default. You can check it under Ultimate Blocks in your WordPress admin menu, on the Extensions tab.
What you can use it for #
- Hide a large image slider or table of contents on phones to keep the page short.
- Show a compact call to action on mobile and a larger one on desktop.
- Hide desktop-only content, such as a wide comparison, on small screens.
- Show a tap-to-call button only on phones.
How to hide a block on mobile, tablet or desktop #
- Open the post or page in the WordPress block editor and click the Ultimate Blocks block.
- In the block sidebar, open the Settings tab (gear icon).
- Scroll down and click Responsive Control to expand the panel.
- Turn on the toggle for each screen size where the block should be hidden: Hide On Desktop, Hide On Tablet or Hide On Mobile. By default all three are off, so the block shows on every device.
- Click Save or Update.
In this example, the block is hidden on tablets only:
Screen sizes used #
| Option | Hides the block on |
|---|---|
| Hide On Mobile | Screens up to 799px wide |
| Hide On Tablet | Screens from 800px to 1023px wide |
| Hide On Desktop | Screens 1024px and wider |
Check the result #
Responsive Control works on the live site. Open the published page and make the browser window narrower, or open it on your phone. The block disappears at the screen size you chose and comes back at the others.
Show a different block on each device #
- Add two versions of the block, for example a short Call To Action and a long one.
- On the short version, turn on Hide On Desktop.
- On the long version, turn on Hide On Tablet and Hide On Mobile.
- Phone visitors now see the short version, and desktop visitors see the long one.
Good to know #
- The block is hidden with CSS. It is still in the page source and still loads, so do not use Responsive Control to hide private content. To hide a block from certain users, use Visibility Control (Pro).
- If you turn on all three toggles, the block is hidden everywhere.
- Responsive Control works on Ultimate Blocks blocks only.
Frequently asked questions #
How do I hide a block on mobile in WordPress?
Select the Ultimate Blocks block, open the Settings tab, expand Responsive Control and turn on Hide On Mobile. The block is hidden on screens up to 799px wide.
Is Responsive Control free?
Yes. It is part of the free Ultimate Blocks plugin and works on every Ultimate Blocks block.
What screen widths count as tablet and mobile?
Mobile is up to 799px wide, tablet is 800px to 1023px, and desktop is 1024px and wider.
Why does the hidden block still show in the editor?
Responsive Control applies on the live site. Preview the published page and resize your browser to check it.
Does hiding a block on mobile make the page faster?
Not by much. The block is hidden with CSS, so it still loads. It mainly keeps the layout clean on small screens.
