Conditional Blocks – Control visibility of any Gutenberg block

Description

Conditional Blocks allows you to create a unique experience for your visitors and customers. Dynamic content using WordPress blocks is now easy.

Conditionally hide Gutenberg blocks, even third-party blocks! You can use Conditional Blocks to restrict content on a memebership site, or you can created unique design on your landing pages.

Be creative, build templates with dynamic content – you can change the visibility of any block, grouped blocks and each nested block even reusable blocks! We plan on having Conditional Blocks ready for Full Site Editing (FSE) themes, if you have any ideas – let us know.

What can conditional blocks do?

Conditional Blocks makes it easy to change visibility of any block.

Included condition types in the free version:

  • Show or Hide block based user state (logged in users or logged out users). Great for creating membership content for signed in users.
  • Show or hide block on mobile screens.
  • Show or hide block on tablet screens.
  • Show or hide block on desktop screens.
  • Modify the screensizes to fit the CSS breakpoints of your theme.

Learn more about the features

Do more with Conditional Blocks Pro

  • Show block depending on user roles (WooCommerce Customer, editor, subscriber, custom roles, etc).
  • Show block content for between date ranges.
  • Show block for any device (HTTP UserAgent) (iPhone, Android, macOS, linux and Windows).
  • Show block based on URL Referer (e.g if user came from Google.com or twitter.com).
  • Show block based on post meta fields, including custom meta fields and data.
  • Show block based on URL query strings (URL variables), You display custom confirmation content for form plugins like Gravitiy Forms.
  • Show block based on post ID or hide block on post IDs.
  • Create and manage presets of conditions to apply to multiple blocks acorss your whole site.
  • Show block based on PHP Logic and custom functions. The possibilities are unlimited.
  • Support development of new features.

See all features & benefits of Conditional Blocks Pro

Create content while your page is live.

Safely work on your already published WordPress content over multiple days by hiding the blocks that aren’t yet finished. Just make them visble on when you are ready.

Restrict Gutenberg Blocks

Restrict any Gutenberg block by simply clicking on it, You’ll be able to set it to appear for logged in or out users only.

Great for creating content that’s visable to members only on your site.

Control Mobile Blocks

You can select specific screen sizes to display your blocks on, and exclude them from others! Pick and choose if the block should be shown on mobile, tablet or desktop. The block content will automatically be displayed or hidden for each different screensizes.

Compatibility

Conditional Blocks works with any theme that uses the Gutenberg Block Editor.

We’ve tested Conditional Blocks with the follow plugins:

  • Stackable Blocks
  • Atomic Blocks
  • CoBlocks
  • Editorskit
  • WooCommerce Blocks (Product Blocks)
  • Easy Digital Downloads Blocks
  • Ultimate Addons for Gutenberg
  • Otter Blocks & Templates
  • GenerateBlocks
  • Kadence Blocks
  • Genesis Blocks

Please reach out on support if you are experiencing issues with another plugin.

LEARN MORE

  • Documentation: Learn how to set up and use our features.
  • Blog: Read our guides and tutorials.
  • Website: Find out more about us and the pro version.
  • Twitter: Follow us on Twitter.

Screenshots

  • How to customize WordPress visibility with Conditonal Blocks.
  • Conditonal Blocks 2.0+ - logged out/in user content block.
  • Frontend showing the logged out user block.
  • Editor options for conditionally showing block on screen sizes.
  • Frontend showing different blocks for different screensizes using responsive blocks.

Installation

Conditional Blocks for Gutenberg Installation Instructions:

  1. Upload the Conditional Blocks plugin to your /wp-content/plugin/ directory or through the plugin admin section under “add new”.,
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.,
  3. That’s it!

FAQ

Can I conditionally hide blocks?

Yes, you can conditionally hide any Gutenberg block using any of the conditions types.

Reviews

March 15, 2021
Unstable plugin. You rely on (in)visibility of blocks, but after every update you can't be sure if it works or not, messing up your whole website. Not a recommendable plugin.
March 3, 2021
The huge potential with this plugin, plus the new block editor is immense. I look forward to bringing this to future clients.
September 21, 2020
The show hide block on screen size feature is just what I wanted. Amie
August 9, 2020
I don't need this plugin very often (in fact, right now, I'm not sure I'm using it at all on my site) but, when I do, it's a lifesaver. Really, this kind of functionality should be built into the block editor - until then, this is fantastic.
June 28, 2020
Теперь блоки Гутенберг можно скрыть для определенных ролей пользователей и на определенных устройствах. Супер! Спасибо!
Read all 10 reviews

Contributors & Developers

“Conditional Blocks – Control visibility of any Gutenberg block” is open source software. The following people have contributed to this plugin.

Contributors

“Conditional Blocks – Control visibility of any Gutenberg block” has been translated into 1 locale. Thank you to the translators for their contributions.

Translate “Conditional Blocks – Control visibility of any Gutenberg block” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

2.0.1

  • Improved performance by only including the CSS for responsive blocks on the pages they are used.

2.0.0

Complete rebuild of Conditional Blocks. Please read the 2.0 introduction & release notes https://conditionalblocks.com/introducing-conditional-blocks-2-0/

  • Conditional Blocks 2.0 is a complete rebuild.
  • Existing users can safely update, old conditions will continue to work in the background. Editing blocks with old conditions will require clicking “Convert to 2.0 conditions”, when opening the new Condition Builder.
  • Ready for WordPress 5.7 and Gutenberg 10.1

1.0.9

  • Fixed: Inner blocks conditions work as expected again.

1.0.8

  • Ready and tested with WordPress 5.6
  • Improved Compatibility with themes that could be override css. https://wordpress.org/support/topic/maybe-adds-important-css-rules/

1.0.7

  • Tested: with GenerateBlocks.
  • Fixed: Added a fix to the issue where server side rendered blocks would cause errors with Conditional Blocks. https://github.com/WordPress/gutenberg/issues/16850

1.0.6

  • Ready for WordPress 5.5

1.0.5

  • Added feature to modify the CSS breakpoints.
  • Updated date range conditions in Conditional Blocks Pro
  • Fixed issue where MomentJS could not be found in Conditional Blocks Pro

1.0.4

  • Ready and tested with WordPress 5.4
  • Pro: Fixed date conditions sometimes applying to new blocks when new dates are added.
  • Minor code improvements.
  • Tested with Gutenberg 7.7.1

1.0.3

  • Improved how device size conditions are handled across all blocks.
  • Fixed hiding on device sizes across could cause full-width blocks to be standard size.
  • Fixed Conditional Blocks highlighting for Gutenberg 7.4+
  • Fixed postmeta condition being skipped.
  • Fixed postmeta condition saving incorrectly on blocks.

1.0.2

  • Removed Freeemius and tracking.

1.0.1

  • New Date Range Conditions for Blocks in Pro! Learn about Date Conditions
  • Improved JS browers caching with file versions.
  • Improved code structure.
  • Fixed conflict with Yoast and other plugings which triggers Gutenberg by using React.

1.0.0

  • initial Release of Conditional Blocks for Gutenberg.