🎉 Use coupon MYXERO to enjoy 20% recurring discount on any plan. View Pricing
Responsive Block Control – Hide blocks based on display width
Responsive Block Control – Hide blocks based on display width

Responsive Block Control – Hide blocks based on display width

5/5 (4 ratings) 1K+ active installs Updated Feb 21, 2026
The 'Responsive Block Control' toggles at work in the block editor.

The 'Responsive Block Control' toggles at work in the block editor.

Responsive Block Control adds responsive toggles to a “Visibility” panel of the block editor, to show or hide blocks according to screen width.

Security

Version 1.3.1 resolves a stored cross‑site scripting (XSS) vulnerability (CVE‑2025‑62135) affecting earlier versions (<= 1.2.9).
Users with contributor access or higher should update immediately.

If you discover a security vulnerability, please report it responsibly to: [email protected]

Limitations

Does not work with the Classic Block, Widget Block or Widget Area Block [‘core/freeform’, ‘core/legacy-widget’, ‘core/widget-area’], as the those blocks do not support block attributes. Does also not work with the HTML Block [‘core/html’] inside the Widget Screen, as this one also does not support block attributes there.

Configuration

Override existing breakpoints

function override_responsive_block_control_breakpoints($break_points) {
     $break_points['base'] = 0;
     $break_points['mobile'] = 400;
     $break_points['tablet'] = 800;
     $break_points['desktop'] = 1000;
     $break_points['wide'] = 1600;

     return $break_points;
 }

 add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_breakpoints');

Provide custom CSS

You can provide your own CSS rules per breakpoint using the new filter responsive_block_control_custom_css_rules.

add_filter('responsive_block_control_custom_css_rules', function($rules) {
    return [
        'mobile'  => 'display: none !important;',
        'tablet'  => 'display: none !important;',
        'desktop' => 'display: none !important;',
        'wide'    => 'display: none !important;',
    ];
});

Stop css output completely

 function override_responsive_block_control_add_css() {
      return false;
  }
  add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_add_css');