How Does Block Visibility Work?
Block Visibility is the easiest way to create dynamic content in WordPress. There is no external editor or new interface to learn. Work directly in the Block Editor with blocks you are already familiar with. In a matter of seconds, you will be able to transform static blocks into conditional and personalized content.
It takes just 3 simple steps…
Create Your Block Content
Begin by adding your content to the Block Editor. Block Visibility works with all blocks, including those provided by third-party plugins like Jetpack and WooCommerce.
Here we have used Cover, Heading, Paragraph, and Buttons blocks to create a promotional banner. We ultimately want this content to only be visible starting on July 12th at 9:00 am.
Set the Desired Visibility Controls
With your content finalized, navigate to the Visibility panel in the settings sidebar of the selected block. Choose the visibility control(s) that you would like to apply. Update the page/post when finished.
We have chosen the Date & Time control and configured a schedule. The block will become visible at 9:00 am on July 12th. Conditional settings only need to be applied to the Cover block. All blocks inside of the Cover block will be hidden as well.
Marvel at the Results
The block is now conditional and will only be visible based on the configured controls. That was pretty easy, right?
Best of all, Block Visibility is 100% free!
Location is currently the most powerful feature in Block Visibility. Built with the upcoming WordPress Full Site Editing functionality in mind, this control allows you to show or hide block content based on where the block is located as well as the “attributes” of its current location.
This control pairs beautifully with reusable blocks, query blocks, and Full Site Editing page templates. For example, show unique block content based on the category of a post. Or perhaps hide navigation blocks on specific pages, like your shopping cart page. You are limited only by your imagination.
Advanced Date Time Functionality
With Block Visibility, you are able to conditionally display block content by the day of week and specific time intervals throughout the day using the Date & Time control. Perfect for when you need granular control over when blocks are visible.
No integration suite is complete without WooCommerce compatibility. The WooCommerce control allows you to conditionally display block content based on shopping cart contents, product metrics, and a range of customer metrics.
This control is essential for promotional and informational messaging to your customers. For logged-in customers, you can also celebrate their past patronage with specific content based on how much they have spent, past purchases, and more.
The WooCommerce control is available to past Pro customers and will soon be available in the base plugin.
Easy Digital Downloads Integration
The Easy Digital Downloads control enhances your eCommerce capabilities with conditional content based on the shopping cart’s contents and a wide range of customer metrics.
Use this control to display up-sells and provide past customers personalized messaging based on their purchase history, how much they have spent, average order value, and more. Future enhancements for EDD official extensions are planned.
The Easy Digital Downloads control is available to past Pro customers and will soon be available in the base plugin.
Referral Source Control
The Referral Source Control allows you to conditionally display blocks based on the domain from which a user arrived at your website.
For example, you could display specific messaging to users coming from social media sites. Or perhaps present users with a special offer when they arrive from a third-party site like Yelp, TripAdvisor, or Expedia. The options are endless.
Browser & Device Control
With the Browser & Device control, you will be able to easily display custom content based on the browser and/or device of the current user. All major browsers and devices are supported.
For example, let’s assume your website has custom functionality that works best on Google Chrome. You want to create a message for non-Chrome users to let them know they will have a sub-optimal experience and should download Chrome. It’s as simple as a few clicks!
URL Path Control
The URL Path control allows you to conditionally display blocks based on the URL of the page that the block is on. While Block Visibility already includes the Location control, which was designed for location-based visibility, the URL Path control provides an additional level of flexibility.