WordPress.org

Plugin Directory

Responsive Block Control – Hide blocks based on display width

ھي پلگ ان WordPress جي جديد 3 وڏين رليزز سان آزمايو نه ويو آھي. اهو ٿي سگهي ٿو وڌيڪ برقرار يا سپورٽ نه ٿي سگهي ۽ ٿي سگهي ٿو مطابقت جا مسئلا جڏهن ورڈپریس جي وڌيڪ تازي ورزن سان استعمال ڪيو وڃي.

Responsive Block Control – Hide blocks based on display width

وضاحت

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

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

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.

انسٽاليشن

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

جائزا

6 آگسٽ 2022 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.
7 مارچ 2020
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 تبصرا پڙهو

تعاون ڪندڙ & ڊولپرز

“Responsive Block Control – Hide blocks based on display width” اوپن سورس سافٽ ويئر آهي. ھيٺين ماڻھن ھن پلگ ان ۾ حصو ورتو آھي.

تعاون ڪندڙ

واحد: “Responsive Block Control – Hide blocks based on display width” 1 لوڪل ۾ ترجمو ڪيو ويو آهي. ترجمي ڪندڙن جي مهرباني سندن تعاون لاءِ.

ترجمو ڪريو “Responsive Block Control – Hide blocks based on display width” توهان جي ٻولي ۾.

ڊولپمينٽ ۾ دلچسپي؟

ڪوڊ براؤز ڪريو، چيڪ ڪريو SVN مخزن، يا رڪنيت حاصل ڪريو ڊولپمينٽ لاگ پاران RSS.

لاگ تبدیل ڪريو

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 visiblity 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