Title: Responsive Block Control &#8211; Hide blocks based on display width
Author: landwire
Published: <strong>2020-يىلى 30-يانۋار</strong>
Last modified: 2026-يىلى 21-فېۋرال

---

قىستۇرما ئىزدە

![](https://ps.w.org/responsive-block-control/assets/banner-772x250.png?rev=2236119)

![](https://ps.w.org/responsive-block-control/assets/icon.svg?rev=2236128)

# Responsive Block Control – Hide blocks based on display width

 يازغۇچى [landwire](https://profiles.wordpress.org/landwire/)

[چۈشۈر](https://downloads.wordpress.org/plugin/responsive-block-control.1.3.2.zip)

[شۇئان ئالدىن كۆزىتىش](https://ug.wordpress.org/plugins/responsive-block-control/?preview=1)

 * [تەپسىلاتلار](https://ug.wordpress.org/plugins/responsive-block-control/#description)
 * [باھالاشلار](https://ug.wordpress.org/plugins/responsive-block-control/#reviews)
 *  [ئورنىتىش](https://ug.wordpress.org/plugins/responsive-block-control/#installation)
 * [ئىجادىيەت](https://ug.wordpress.org/plugins/responsive-block-control/#developers)

 [قوللاش](https://wordpress.org/support/plugin/responsive-block-control/)

## چۈشەندۈرۈش

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: security@
saschapaukner.de

#### 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');
    ```

## ئېكران كەسمىسى

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

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

## ئورنىتىش

 1. Upload `responsive-block-control.php` to the `/wp-content/plugins/` directory
 2. Activate the plugin through the ›Plugins‹ menu in WordPress

## FAQ

### Is it possible to use different breakpoints?

Yes, use the following code in your functions.php or similar.

    ```
    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');
    ```

### Can I provide custom CSS per breakpoint? I want to display: none instead of hiding just visually

Yes, use the responsive_block_control_custom_css_rules filter:

    ```
    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;',
        ];
    });
    ```

This ensures the CSS respects the current breakpoints and applies to the correct.
rbc-is-hidden-on-{breakpoint} classes.

### Can I write my own CSS and just use the classes?

Yes, that is absolutely possible. Just use the filter below to stop the plugin from
injecting its‹ styles:

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

## باھالاشلار

![](https://secure.gravatar.com/avatar/e949c500105ab437ffc4f8e8c3e9012c8ed43a6485a64e7d698f11e3db0a3aa8?
s=60&d=retro&r=g)

### 󠀁[Excellent!](https://wordpress.org/support/topic/excellent-12135/)󠁿

 [diegosomar](https://profiles.wordpress.org/diegosomar/) 2022-يىلى 4-سېنتەبىر 1
reply

Very nice plugin! Tks!

![](https://secure.gravatar.com/avatar/f87e49f4af010a291d60f1079bc1651a4e4b12c02a38b19232a32bf445376869?
s=60&d=retro&r=g)

### 󠀁[Great Plugin.](https://wordpress.org/support/topic/great-plugin-34764/)󠁿

 [phungkha](https://profiles.wordpress.org/phungkha/) 2022-يىلى 6-ئاۋغۇست 1 reply

«Responsive Block Control» is one of the best plugins almost used on my all website.
I just love it and expect more with the updating of the WordPress version.

![](https://secure.gravatar.com/avatar/e077e901ca415a426dad1c384e9c4637e75da1ff7a20d766ca2a066b9b25ad90?
s=60&d=retro&r=g)

### 󠀁[Great simple plugin!](https://wordpress.org/support/topic/great-simple-plugin-98/)󠁿

 [alexmustin](https://profiles.wordpress.org/alexmustin/) 2021-يىلى 5-فېۋرال 1 reply

This plugin does exactly what I need, without adding any extra bloat. Thanks!

![](https://secure.gravatar.com/avatar/c5b1064bacade59c71240f5681de4109e5f574f0a6507e4fb582a591b2b15b0a?
s=60&d=retro&r=g)

### 󠀁[Adds a crucial missing Gutenberg functionality](https://wordpress.org/support/topic/adds-a-crucial-missing-gutenberg-functionality/)󠁿

 [andreasmarberg](https://profiles.wordpress.org/andreasmarberg/) 2020-يىلى 7-مارت

Hi there, thank you for a great little plugin! It is ideal for showing some content
for small screens and some other content for bigger screens. What really makes it
stand out from other plugins is that you can adjust the breakpoints and tune them
to correspond with your plugins in your theme.

 [ 4 باھالاشنىڭ ھەممىنى ئوقۇش ](https://wordpress.org/support/plugin/responsive-block-control/reviews/)

## تۆھپىكار ۋە ئىجادكار

«Responsive Block Control – Hide blocks based on display width» كودى ئوچۇق يۇمشاق
دېتال. تۆۋەندىكى كىشىلەر بۇ قىستۇرمىغا تۆھپە قوشقان.

تۆھپىكار

 *   [ landwire ](https://profiles.wordpress.org/landwire/)

«Responsive Block Control – Hide blocks based on display width» 2 تىلغا تەرجىمە 
قىلىنغان. [تەرجىمانلار](https://translate.wordpress.org/projects/wp-plugins/responsive-block-control/contributors)
نىڭ تۆھپىسى ئۈچۈن رەھمەت.

[«Responsive Block Control – Hide blocks based on display width» نى تىلىڭىزغا تەرجىمە قىلىڭ](https://translate.wordpress.org/projects/wp-plugins/responsive-block-control)

### ئىجادىيەتكە قىزىقامسىز؟

[كودقا كۆز يۈگۈرتۈپ](https://plugins.trac.wordpress.org/browser/responsive-block-control/)،
[SVN خەزىنە](https://plugins.svn.wordpress.org/responsive-block-control/) تەكشۈرۈپ
ياكى [RSS](https://plugins.trac.wordpress.org/log/responsive-block-control/?limit=100&mode=stop_on_copy&format=rss)
ئارقىلىق [ئىجادىيەت خاتىرىسى](https://plugins.trac.wordpress.org/log/responsive-block-control/)
گە مۇشتەرى بولغىلى بولىدۇ.

## ئۆزگىرىش خاتىرىسى

#### 1.3.2

 * Removed console.log

#### 1.3.1

 * Security fix: Mitigated authenticated Stored XSS (CVE‑2025‑62135).
 * Added responsive_block_control_custom_css_rules filter to allow developers to
   provide their own CSS per breakpoint
 * Fixed media query generation to match breakpoints correctly
 * Ensured JS only injects CSS if customCss is present and sanitized

#### 1.3.0

 * Raised version after testing and package updates

#### 1.2.9

 * Added check to not load editor assets in the front end

#### 1.2.8

 * Updated asset loading for changes introduced in WordPress 6.3
 * Added «Limitations» section to readme

#### 1.2.7

Recompiled assets for distribution

#### 1.2.6

 * fixed translation for visibility information
 * added check for Classic Block and disabled display of settings there

#### 1.2.0

 * fixed some JS logic
 * added visibility information to blocks in Gutenberg editor

#### 1.1.1

 * fixed regex for adding classes in the frontend

#### 1.1.0

 * Removed the «blocks.getSaveContent.extraProps» JS filter as it causes block validation
   errors
 * Instead we are using the recommended PHP filter «render_block» to add the necessary
   classes vie preg_replace()

#### 1.0.0

 * Initial Release of the plugin

## Meta

 *  Version **1.3.2**
 *  ئاخىرقى يېڭىلانغان ۋاقىت **5 ئاي بۇرۇن**
 *  ئاكتىپ ئورنىتىش سانى **1,000+**
 *  WordPress نەشرى ** 5.2 ياكى يۇقىرى **
 *  **6.9.4** دا سىنالغان
 *  PHP نەشرى ** 7.4 ياكى يۇقىرى **
 *  تىل
 * [English (US)](https://wordpress.org/plugins/responsive-block-control/)، [Spanish (Chile)](https://cl.wordpress.org/plugins/responsive-block-control/)
   ۋە [Spanish (Spain)](https://es.wordpress.org/plugins/responsive-block-control/).
 *  [تىلىڭىزغا تەرجىمە قىلىڭ](https://translate.wordpress.org/projects/wp-plugins/responsive-block-control)
 * بەلگە
 * [block](https://ug.wordpress.org/plugins/tags/block/)[hide content](https://ug.wordpress.org/plugins/tags/hide-content/)
   [responsive](https://ug.wordpress.org/plugins/tags/responsive/)[visibility](https://ug.wordpress.org/plugins/tags/visibility/)
   [width](https://ug.wordpress.org/plugins/tags/width/)
 *  [ئالىي كۆرۈنۈش](https://ug.wordpress.org/plugins/responsive-block-control/advanced/)

## دەرىجە

 5/5 يۇلتۇز

 *  [  4 5-يۇلتۇز باھالاش     ](https://wordpress.org/support/plugin/responsive-block-control/reviews/?filter=5)
 *  [  0 4-يۇلتۇز باھالاش     ](https://wordpress.org/support/plugin/responsive-block-control/reviews/?filter=4)
 *  [  0 3-يۇلتۇز باھالاش     ](https://wordpress.org/support/plugin/responsive-block-control/reviews/?filter=3)
 *  [  0 2-يۇلتۇز باھالاش     ](https://wordpress.org/support/plugin/responsive-block-control/reviews/?filter=2)
 *  [  0 1-يۇلتۇز باھالاش     ](https://wordpress.org/support/plugin/responsive-block-control/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/responsive-block-control/reviews/#new-post)

[بارلىق ئىنكاسنى كۆرسەت](https://wordpress.org/support/plugin/responsive-block-control/reviews/)

## تۆھپىكار

 *   [ landwire ](https://profiles.wordpress.org/landwire/)

## قوللاش

چۈشەندۈرۈشىڭىز بارمۇ؟ ياردەم لازىممۇ؟

 [قوللاش مۇنبىرىنى كۆرسەت](https://wordpress.org/support/plugin/responsive-block-control/)

## ئىئانە

بۇ قىستۇرمىنىڭ ياخشىلىنىشىنى قوللامسىز؟

 [ بۇ قىستۇرمىغا ئىئانە قىلىش ](https://saschapaukner.de)