Nothing to consider.<\/p>"},"ratings":{"1":0,"2":0,"3":0,"4":0,"5":4},"assets_icons":{"icon-256x256.png":{"filename":"icon-256x256.png","revision":2236128,"resolution":"256x256","location":"assets","locale":""},"icon.svg":{"filename":"icon.svg","revision":2236128,"resolution":false,"location":"assets","locale":false}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":2236119,"resolution":"1544x500","location":"assets","locale":""},"banner-772x250.png":{"filename":"banner-772x250.png","revision":2236119,"resolution":"772x250","location":"assets","locale":""}},"assets_blueprints":{"blueprint.json":{"filename":"blueprint.json","revision":3466617,"resolution":false,"location":"assets","locale":"","contents":"{\"$schema\":\"https:\\\/\\\/playground.wordpress.net\\\/blueprint-schema.json\",\"landingPage\":\"\\\/?p=6\",\"preferredVersions\":{\"php\":\"8.1\",\"wp\":\"latest\"},\"phpExtensionBundles\":[\"kitchen-sink\"],\"steps\":[{\"step\":\"login\",\"username\":\"admin\",\"password\":\"password\"},{\"step\":\"installPlugin\",\"options\":{\"activate\":true},\"pluginData\":{\"resource\":\"wordpress.org\\\/plugins\",\"slug\":\"responsive-block-control\"}},{\"step\":\"runPHP\",\"code\":\" 6,\\n'post_title' => 'Responsive Block Control',\\n'post_type' => 'page',\\n'post_content' => '\\n
Visible on Mobile<\\\/p>\\n\\n\\n\\n
Visible on Tablet<\\\/p>\\n\\n\\n\\n
Visible on Desktop<\\\/p>\\n\\n\\n\\n
Visible on Wide<\\\/p>\\n\\n\\n\\n
Current Viewport Size is: <\\\/p>\\n\\n\\n\\n
Mobile<\\\/strong><\\\/p>\\n\\n\\n\\n Tablet<\\\/strong><\\\/p>\\n\\n\\n\\n Desktop<\\\/strong><\\\/p>\\n\\n\\n\\n Wide<\\\/strong><\\\/p>\\n<\\\/div>\\n',\\n'post_status' => 'publish',\\n'post_author' => 1\\n));\"}]}"}},"all_blocks":[],"tagged_versions":["1.0.0","1.1.0","1.1.1","1.2.0","1.2.1","1.2.2","1.2.3","1.2.4","1.2.5","1.2.6","1.2.7","1.2.8","1.2.9","1.3.0","1.3.1","1.3.2"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":2236119,"resolution":"1","location":"assets","locale":""}},"screenshots":{"1":"The 'Responsive Block Control' toggles at work in the block editor."},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[1220,5237,606,6309,26984],"plugin_category":[],"plugin_contributors":[180763],"plugin_business_model":[],"class_list":["post-116503","plugin","type-plugin","status-publish","hentry","plugin_tags-block","plugin_tags-hide-content","plugin_tags-responsive","plugin_tags-visibility","plugin_tags-width","plugin_contributors-landwire","plugin_committers-landwire"],"banners":{"banner":"https:\/\/ps.w.org\/responsive-block-control\/assets\/banner-772x250.png?rev=2236119","banner_2x":"https:\/\/ps.w.org\/responsive-block-control\/assets\/banner-1544x500.png?rev=2236119","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":"https:\/\/ps.w.org\/responsive-block-control\/assets\/icon.svg?rev=2236128","icon":"https:\/\/ps.w.org\/responsive-block-control\/assets\/icon.svg?rev=2236128","icon_2x":false,"generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/responsive-block-control\/assets\/screenshot-1.png?rev=2236119","caption":"The 'Responsive Block Control' toggles at work in the block editor."}],"raw_content":"\n Responsive Block Control adds responsive toggles to a \"Visibility\" panel of the block editor, to show or hide blocks according to screen width.<\/p>\n\n Version 1.3.1 resolves a stored cross\u2011site scripting (XSS) vulnerability (CVE\u20112025\u201162135) affecting earlier versions (<= 1.2.9).<\/strong>\nUsers with contributor access or higher should update immediately.<\/p>\n\n If you discover a security vulnerability, please report it responsibly to: security@saschapaukner.de<\/p>\n\n 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.<\/p>\n\n You can provide your own CSS rules per breakpoint using the new filter responsive_block_control_custom_css_rules.<\/p>\n\n Yes, use the following code in your functions.php or similar.<\/p>\n\n Yes, use the responsive_block_control_custom_css_rules filter:<\/p>\n\n This ensures the CSS respects the current breakpoints and applies to the correct .rbc-is-hidden-on-{breakpoint} classes.<\/p><\/dd>\n Yes, that is absolutely possible. Just use the filter below to stop the plugin from injecting its' styles:<\/p>\n\n Recompiled assets for distribution<\/p>\n\nSecurity<\/h3>\n\n
Limitations<\/h4>\n\n
Configuration<\/h3>\n\n
Override existing breakpoints<\/h4>\n\n
function override_responsive_block_control_breakpoints($break_points) {\n $break_points['base'] = 0;\n $break_points['mobile'] = 400;\n $break_points['tablet'] = 800;\n $break_points['desktop'] = 1000;\n $break_points['wide'] = 1600;\n\n return $break_points;\n }\n\n add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_breakpoints');\n<\/code><\/pre>\n\nProvide custom CSS<\/h4>\n\n
add_filter('responsive_block_control_custom_css_rules', function($rules) {\n return [\n 'mobile' => 'display: none !important;',\n 'tablet' => 'display: none !important;',\n 'desktop' => 'display: none !important;',\n 'wide' => 'display: none !important;',\n ];\n});\n<\/code><\/pre>\n\nStop css output completely<\/h4>\n\n
function override_responsive_block_control_add_css() {\n return false;\n }\n add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_add_css');\n<\/code><\/pre>\n\n\n\n
responsive-block-control.php<\/code> to the \/wp-content\/plugins\/<\/code> directory<\/li>\n\n
Is it possible to use different breakpoints?<\/h3><\/dt>\n
function override_responsive_block_control_breakpoints($break_points) {\n $break_points['base'] = 0;\n $break_points['mobile'] = 400;\n $break_points['tablet'] = 800;\n $break_points['desktop'] = 1000;\n $break_points['wide'] = 1600;\n\n return $break_points;\n }\n\n add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_breakpoints');\n<\/code><\/pre><\/dd>\nCan I provide custom CSS per breakpoint? I want to display: none instead of hiding just visually<\/h3><\/dt>\n
add_filter('responsive_block_control_custom_css_rules', function($rules) {\n return [\n 'mobile' => 'display: none !important;',\n 'tablet' => 'display: none !important;',\n 'desktop' => 'display: none !important;',\n 'wide' => 'display: none !important;',\n ];\n});\n<\/code><\/pre>\n\nCan I write my own CSS and just use the classes?<\/h3><\/dt>\n
function override_responsive_block_control_add_css() {\n return false;\n }\n add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_add_css');\n<\/code><\/pre><\/dd>\n\n<\/dl>\n\n\n1.3.2<\/h4>\n\n
\n
1.3.1<\/h4>\n\n
\n
1.3.0<\/h4>\n\n
\n
1.2.9<\/h4>\n\n
\n
1.2.8<\/h4>\n\n
\n
1.2.7<\/h4>\n\n
1.2.6<\/h4>\n\n
\n
1.2.0<\/h4>\n\n
\n
1.1.1<\/h4>\n\n
\n
1.1.0<\/h4>\n\n
\n
1.0.0<\/h4>\n\n
\n