With the ability to hide blocks coming to 6.9, this issue is to discuss what comes next. Previously, adding the ability to hide a block based on screen size has come up as a requested feature and something to explore in this current issue:

There are plugin tools like "block visibility" that can bridge some of those gaps until we have the space and bandwidth to do something in core that can be sustainable. For example, one idea that has been discussed a few times is allowing edits done while viewing "mobile" to be applied to that breakpoint alone. The amount of edits you can do would be naturally limited to things that are expressive (for example, removing a block could become "hide this block" when in that context). It could be an option to explore.

Hiding a block based on screen size has also come up in Responsive previewing and device-specific editing. To keep this in an actionable state, let's use this issue to discuss building upon hiding blocks for additional features in 7.0.

Development phases

These are high level so far. We have designs and the following proof of concept PRs as reference material:

• Add block visibility breakpoints support for dynamic configuration #73735
• Introduce responsive editing #73888

Phases and tasks for 7.0

Tasks are tracked on the WordPress 7.0 planning task.

Beyond 7.0

Speculative tasks for future releases.

• configurable breakpoints (in theme.json and eventually in the UI)
• theme.json settings configuration at sitewide and block level to disable the feature in the UI (like other block supports)
• extend visibility rules to other criteria, e.g., user roles or time. See Add option to hide blocks based on screen size #72502 (comment)
• centralization of breakpoint/device logic across WordPress packages (currently disparate)
• centralization of currently-hidden blocks somewhere the UI with toggle/reset controls
• extend style engine, where appropriate, to handle the display property and related logic

Related, and sorta related issues

• Adding class on preview (mobile, tablet, desktop, ...) to visual-editor or body #23430
• Allow responsive styles via theme.json #27107
• Allow extending editor preview in more ways #65005
• Replace hardcoded breakpoints in front-end CSS with more modular CSS #35848
• Responsive previewing and device-specific editing #19909
• Blocks: States #57719
• Hidden blocks should still be visible in the editor #73838