內容簡介
Responsive Block Control 將響應式切換添加到區塊編輯器（即 Gutenberg）的“可見性”面板中，以根據屏幕寬度顯示或隱藏區塊。
設置
覆蓋現有斷點
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');
完全停止 CSS 輸出
function override_responsive_block_control_add_css() {
return false;
}
add_filter('responsive_block_control_breakpoints', 'override_responsive_block_control_add_css');
外掛標籤
開發者團隊
② 後台搜尋「Responsive Block Control – Hide blocks based on display width」→ 直接安裝（推薦）
原文外掛簡介
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');
