Block Visibility — Conditional Visibility Controls for all Blocks

Descrição

Block Visibility allows you to control which blocks are visible on your website and who can see them. Effortlessly display conditional blocks based on specific schedules, user roles, screen sizes, query strings, ACF fields, WP Fusion tags and more. Block Visibility unlocks the power of dynamic and personalized content.

Built for the new Block (Gutenberg) Editor, this plugin was designed to work with any WordPress block. This includes blocks natively provided by WordPress as well as third-party blocks.

Visibility Controls

Visibility controls determine whether a block should be visible to users on the frontend of your website based on a range of conditions. Current controls include:

  • Hide blocks from all users
  • Schedule content block visibility using a start and end date/time
  • Conditionally display blocks based on screen size (Desktop, Tablet, Mobile, and more)
  • Only show blocks to logged-in users
  • Only show blocks to logged-out users
  • Only show blocks to users with specific roles (Administrator, Subscriber, Customer, Member etc.)
  • Show or hide dynamic blocks based on URL query strings. Great for marketing campaigns!
  • More to come…

Third-Party Integrations

  • Advanced Custom Fields (ACF): Ever wanted to control the visibility of block content based on ACF fields? Well now you can!
  • WP Fusion: Combine Block Visibility with the power of WP Fusion to conditionally show or hide content based on data from your favorite CRM or marketing automation platform.
  • More to come…

Have an idea for additional block logic? Let us know in the plugin support forum.

Why do I need this?

Block Visibility is a lightweight plugin that is designed to do one thing, and one thing well. While there are countless applications for dynamic content, here are a few examples to get you started:

  • Use as a content management tool. Hide new blocks while you are working on them but still keep the page published.
  • Temporarily hide seasonal content on your website rather than having to delete it.
  • Schedule promotional content and/or event information to display at a set time.
  • Show or hide specific content on desktops, tablets or mobile devices.
  • Restrict content so it’s only visible to your customers or members.
  • Display messaging to logged-out users encouraging them to subscribe to your blog.
  • Conditionally display elements in the upcoming Full Site Editor using advanced visibility logic.
  • Dynamic content and personalization can increase visitor engagement and conversions.

For an unbiased review, the plugin was featured on WordPress Tavern.

Powerful Settings

Tailor Block Visibility to your needs, or those of your clients, with powerful plugin settings.

  • Disable any visibility control.
  • Configure up to 4 different breakpoints to optimize the screen size controls.
  • Restrict visibility controls to specific block types.
  • Set permissions so only certain users have access to visibility controls.
  • Disable contextual indicators and other plugin utilities.
  • Enable Full Control Mode 🚀(See the FAQs).
  • Remove all plugin settings on uninstall.

Plays nice with others

Block Visibility is designed to work with any block and has been tested with these top block libraries and plugins.

  • WooCommerce
  • Jetpack
  • CoBlocks
  • Redux Framework
  • Ultimate Addons for Gutenberg
  • Kadence Blocks
  • Otter Blocks
  • Atomic Blocks
  • Gutentor
  • Stackable
  • Getwid
  • EditorsKit
  • Genesis Blocks
  • Advanced Custom Fields (ACF)
  • WP Fusion

Find an issue? Let us know in the plugin support forum and we will investigate ASAP. Excellent compatibility with the greater WordPress block ecosystem is our top priority.

See It In Action

While a bit out of date, the video below provides a good overview of what Block Visibility can do and covers everything in version 1.0. Updated video coming soon!

Stay Connected

Stay up-to-date on Block Visibility using the links below. The plugin is also being developed transparently on GitHub, so give it a star and follow along!

Imagens de tela

  • Quickly and easily hide show or hide blocks on your website.
  • Schedule content, i.e. any Gutenberg block, using start and end date/time settings. The plugin provides complete block scheduling and work with all Gutenberg blocks, including WooCommerce as seen here.
  • Show or hide block on mobile devices, tables, desktops and more.
  • Control who can see each Gutenberg block with user role restrictions. Great for personalization.
  • General plugin settings to enable/disable certain functionality including user permissions and Full Control Mode.
  • Choose which conditional visibility controls you would like to use on your site.
  • Disable or enable conditional visibility on certain block types with the Block Manager.

Instalação

  1. You have a couple options:
    • Go to Plugins → Add New and search for “Block Visibility”. Once found, click “Install”.
    • Download Block Visibility from WordPress.org and make sure the folder us zipped. Then upload via Plugins → Add New → Upload.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. From the ‘Plugins’ page, head directly to the plugin ‘Settings’ page.
  4. Once there, you can click on the ‘Getting Started’ tab where you will be presented with some getting started information along with the plugin demo video.
  5. Start applying conditional visibility controls to all Gutenberg blocks!

FAQ

Who should use Block Visibility?

Block Visibility is a powerful, yet simple, plugin that gives marketing agencies, bloggers, eCommerce websites, and small businesses owners the power to conditionally show or hide blocks on their websites. The need to hide Gutenberg blocks varies. Whether you need to restrict content to certain users like members, or launch a promotional campaign at a specific time with block scheduling, the applications are endless.

If you need content control, i.e. Gutenberg block control, on your WordPress website, then you need Block Visibility.

Do conditional visibility controls really work with any block? (i.e. What is Full Control Mode?)

Yes! However, not all block types are enabled by default. Controls are only provided to blocks that can be added directly to a page/post by the block inserter. Therefore, some specialized blocks, such as child blocks, are not included by default. An example being the individual Column block that is part of the larger Columns block.

That said, you can enable Full Control Mode in the plugin settings. This removes all restrictions and adds conditional visibility controls to every block. You probably will not need Full Control Mode in most cases, but it is there if you do!

Furthermore, while this plugin was designed to be compatible with all blocks, the WordPress ecosystem is ever expanding. If you find a conflict with a certain block, please let us know in the plugin support forum and we will investigate. We are committed to bringing visibility block controls to every Gutenberg block.

Can Block Visibility be used with any WordPress theme?

Yup, this plugin is not theme specific. You just need to be running the latest version of WordPress (5.4+) and be using the Block Editor. This plugin provides zero functionality to the Classic Editor.

Will more conditional visibility controls be added in the future?

Yes, and if you have a specific idea of what you would like to see, please submit a feature request in the plugin support forum on WordPress.org.

Does this plugin work with the upcoming full site editing functionality?

As of version 1.4.0, Block Visibility is supported in the Site Editor, which is provided by Full Site Editing. Note that you will currently need the Gutenberg plugin and a Full Site Editing theme to make use of this functionality. Full Site Editing is still very much in development and you may find bugs or compatibility issues when using this plugin in the Site Editor. If you do, please let us know in the plugin support forum. We are committed to ensuring 100% compatibility by the time Full Site Editing is included in WordPress core.

Does Block Visibility work with Elementor?

No. Block Visibility was design specifically for the WordPress Block (Gutenberg) Editor, and therefore does no work on pages that are controlled by the Elementor editor. There are other visibility logic plugins in the WordPress.org repository designed specifically for Elementor.

Is block visibility controlled using CSS?

Visibility is controlled primarily on the server, so if a block should be hidden based on the set block controls, it will not even be rendered. This ensures the plugin does not load any additional resources on the frontend of your site, thereby optimizing performance. The one exception to this is the Screen Size block controls. Visibility by screen size requires the use of CSS, which is loaded to the frontend of your site if, and only if, these controls are enabled. You can opt to disable this CSS and add the necessary yourself. Visit the plugin Knowledge Base to learn more.

Avaliações

13 de março de 2021
It does what it says on the label! Really great plugin. I especially like how you can customize the available visibility controls. Excited to see this evolve to support more conditions and plugins.
11 de março de 2021
So simple and elegant to use, and incredibly powerful especially when used with user roles. Thank you very much for creating this plugin!
10 de março de 2021
This is one of those plugins which should be in your standard toolkit because it provides useful functionality in an intuitive way ... and doesn't nag you to upgrade to premium all the time! Recommended.
1 de março de 2021
I was impressed by how quickly the developer, Nick Diego, fixed an issue I submitted via the support forum. I love it offers visibility controls for the shortcode element, which is not available from other similar plugins out there. Highly recommend!
20 de fevereiro de 2021
This is such a HUGE help to me on numerous websites I manage. I cannot recommend it strongly enough ! ! In my case I use it to hide a block that contains instructions and reminders to ME as Admin about a specific Short Code used on the page. Some of the things it reminds me of on one of the sites is which of several table ID's I need for different Ferry schedules throughout the year. It can schedule the hide as well, but I do wish it could do a From / To range and automatically repeat that Yearly for example. Or on the 2nd Thursday of every month... etc. P.S. give us a Donate button ... I will be happy to do so !
18 de janeiro de 2021
Free plugin with the feeling that you are using a premium one. Excellent job. I was worried about the various visibility options, but you can enable/disable these options globally from the plugin's settings tab. So if you only need a checkbox to control if the block will be visible or not, you can get it, disabling the rest of options (control per user role for example) that in my case was not necessary. Many thanks to the developer for this contribution!
Leia todas as 12 avaliações

Colaboradores e desenvolvedores

“Block Visibility — Conditional Visibility Controls for all Blocks” é um software com código aberto. As seguintes pessoas contribuíram para este plugin.

Colaboradores

Registro de alterações

1.8.0 – 2021-04-13

Added

  • Added the Advanced Custom Field control, the second third-party integration for Block Visibility! 🎉
  • Added functionality for multiple Date & Time schedules. 🎉
  • Added the ability “invert” the Date & Time control per-block. By default, this control allows you to show the selected block if at least one schedule applies. You can now optionally hide the block if at least one schedule applies!
  • Added the ability to set default visibility controls.
  • Added the ability to easily reset the visibility controls on each block.

Changed

  • Updated control set controls toggle icon to be more consistent with WP core.
  • Updated popover styling to be more consistent with WP core.

Removed

  • Removed the enable_scheduling setting. Users can now easily toggle visibility controls at the block level so this setting is not longer needed. The entire Date & Time control can still be enabled/disabled in the Visibility Control settings.
  • Removed conditional indicator support for the startDateTime and endDateTime properties that were deprecated in version 1.4.1. Frontend visibility tests for these properties are still operational, but will likely be removed in version 2.0.

Fixed

  • Fixed WP Fusion filters to improve the integration.

1.7.1 – 2021-03-29

Fixed

  • Fixed error in the plugin variables REST API route that caused the settings page not to load if WP Debug was enabled. Thanks @gsarig for discovering this issue and opening a support ticket!

1.7.0 – 2021-03-29

Added

  • Added the WP Fusion control, the first third-party integration for Block Visibility! 🎉
  • Added the Query String control, significantly increasing the marketing capabilities of Block Visibility! 🎉
  • Added react-select as a project dependency for all multi-select fields.

Changed

  • Updated control set UI when multiple controls are enabled to emphasize that all control conditions need to be satisfied for the block to be visible.
  • The “Restricted User Roles” setting now uses react-select for a cleaner user interface.
  • Updated contextual indicator icons. A generic indicator is now displayed when more than 2 controls are enabled.

Fixed

  • Fixed issue where blocks that should have been hidden by enabled visibility controls were appearing in REST API requests. This allowed sophisticated users to “see” content that was not intended for them via a public endpoint, i.e. wp-json/wp/v2/.... This is now fixed. Thanks @tkraftner for reporting this.
  • Fixed issue where the REST API url was not being fetched correctly in the plugin settings for WP installations that had prefixed, or “relocated”, the REST API. Thanks Mike for reporting this issue.
  • Fix minor error due to missing attribute schema.

1.6.0 – 2021-03-21

Added

  • New UI allows users to toggle on and off the available visibility controls at the block level, making for a cleaner interface.
  • New “control sets” attribute structure which improves the scalability of the plugin and allows nearly unlimited new features/functionality in the future.

Changed

  • Updated all visibility frontend tests to respect new “control sets” attribute structure while maintaining backwards compatibility.
  • Updated all editor conditional indicators to respect new “control sets” attribute structure while maintaining backwards compatibility.

Removed

  • Removed the obtrusive “Customize controls” admin notice in the editor in favor of a dismissible one-time “Quick tips” popup for new users.
  • Removed verbose attribute specification in the main plugin class for compatibility with blocks rendered server-side. This is no longer needed.
  • hide-control-section.js and corresponding function are no longer needed.

1.5.3 – 2021-03-10

Fixed

  • Fixed PHP error triggered by missing hideBlock attribute setting. Thanks @muppix for discovering this issue and opening a support ticket!

1.5.2 – 2021-03-06

Added

  • Added a support and review nudge on the plugin settings page in hopefully the least annoying way possible. 😉
  • New screenshots and readme updates.

Fixed

  • Fixed bug were visibility settings were still displaying for blocks disabled by the Block Manager.
  • Fixed conditional indicators not displaying for extra large and extra small screen size controls.

1.5.1 – 2021-02-28

Fixed

  • Fixed error where plugin settings were not being fetched from the REST api as expected. This issue impacted websites that had WordPress installed in a subdirectory. Thanks @elenasaygo for discovering this issue and opening a support ticket!
  • Fixed logic in the get_current_user_role() so no errors are thrown when WordPress installed in a subdirectory.

1.5.0 – 2021-02-22

Added

  • Screen Size controls allow you to show or hide block based on the width of the screen (Desktop, Tablet, Mobile and more).
  • Added universal function for retrieving plugin settings.

Changed

  • Minor adjustments to settings layout and styles.
  • All documentation links have been updated to reflect website changes.

Removed

  • Removed legacy visibility controls in REST API settings class.

Fixed

  • Fixed error where scheduling controls were still active on the frontend when disabled in the plugin settings.

1.4.3 – 2021-02-06

Fixed

  • Error that occurred when plugin assets were enqueued on incorrect admin pages. Improved logic now dequeues assets on any admin page without the Block Editor. Thanks @gsarig for catching this!

1.4.2 – 2021-01-19

Fixed

  • Error that occurred when the plugin was deleted.
  • Contextual indicator border not displaying on placeholder blocks (e.g. the Shortcode Block)

1.4.1 – 2021-01-18

Added

  • The ability to disabled scheduling at the block level without having to remove the start and end date/times.
  • The blockVisibility “supports” variable to all blocks types that have visibility enabled. This provide a more consistent method for detecting whether a block should have visibility controls or not.

Changed

  • The contextual indicator icons have been updated and are now more legible.
  • Refactored the scheduling controls.
  • Updated the Visibility by Role labels to be more consistent with standard WordPress labeling and nomenclature.

Deprecated

  • The startDateTime and endDateTime properties of the blockVisibility attribute have been deprecated. All new blocks will use the new scheduling property.

Removed

  • Visibility block attribute defaults in an effort to declutter block markup when only a few settings are enabled.

Fixed

  • Some third-party blocks were not receiving visibility controls when they should have, notably Jetpack blocks, due to the way their block JS is enqueued.

1.4.0 – 2021-01-01

Upgrade Warning

For the long-term maintainability of the Block Visibility plugin, changes to the underlying file structure were needed in version 1.4.0. Therefore, when you upgrade from version 1.3.0 or lower, the plugin will deactivate and you will receive an error message. But don’t worry, simply re-activate Block Visibility and you are good to go.

This is an unfortunate issue that will occur only once. We apologize for any inconvenience that this causes, but trust that this change better positions the plugin for many exciting enhancements in the future!

Added

  • Preliminary compatibility with Full Site Editing (Requires the Gutenberg plugin and a theme that is Full Site Editing compatible)
  • Hooks and slots to support the upcoming Pro add-on

Changed

  • Block Visibility now requires WordPress 5.5+ to take advantage of new core functionality
  • The base plugin file is now simply block-visibility.php and the setup class has been moved
  • Redesigned the Block Visibility settings page
  • Refactored the methods for fetching plugin setting and variable data on the Block Visibility settings page

Removed

  • Component styling that is not longer needed since the version requirement for the plugin is now WordPress 5.5+

1.3.0 – 2020-12-05

Added

  • User permissions now give website administrators control over who can use visibility settings
  • Custom REST API routes for retrieving plugin data

Changed

  • By default, visibility controls are now available to all users that have access to the Block Editor
  • Refactored the methods for fetching plugin setting and variable data in the Block Editor
  • Restructured much of the plugin with a more consistent file/folder layout

Fixed

  • Contextual indicator icon was incorrect when using all visibility controls and the block was disabled

1.2.0 – 2020-11-15

Added

  • Added the ability to “hide on selected roles” in the Restrict by User Roles visibility control Thanks to @edwardsh for the feature request!

1.1.0 – 2020-11-05

Added

  • Date and time controls for block scheduling
  • Contextual indicators for visibility setting to the Block Editor
  • A toolbar option for quickly hiding blocks
  • Additional plugin settings to dynamically control all the new features

1.0.1 – 2020-08-11

Fixed

  • Addressed the PHP warning message that may appear on new installations

1.0.0 – 2020-08-03

  • Initial Release