If you would like to customize your business' homepage, and let the visitors know when they can benefit from discounted prices that you offer daily during the happy hour, then the 'Conditional Display' feature might come in handy.

This feature helps you decide how and what content is viewed by users, based on various display conditions set by you.

In this example we will be looking at how you can customize a block of content in order to display two different sets of information depending on the hours during which the visitors are viewing it.

The first display will be shown during regular business hours, whilst the second one will only be shown during a happy hour sale, that occurs at the end of the day.

Anyone landing on the page during the regular hours will see the products you are usually selling/advertising.

Then, during the happy hour promotion you can display the daily offers.

If, for example, your business is offering virtual services, you can also include contact form where the visitors can register for special quotes, or promo codes.

So let's have a look at how you can recreate the same on your website, using this feature from the Thrive visual editor.

Edit the page or post with Thrive Architect and work on your block of content on which you plan on displaying your business hours. In this example I am using a "Background Section" element, that I've customized to look like this:

With my background section selected and highlighted in the breadcrumbs, I can proceed to setting up the display conditions for it:

Expand the "Conditional Display" tab of the left sidebar and duplicate the default display:

Rename the new display to quickly identify it:

Then, make sure your newly created display is selected:

And proceed with customizing the information that will be displayed during the happy hour.

Use the elements available in the editor to customize the new block of content to your liking:

I've added some notes regarding the available stock:

And I've also added some animations to draw the attention towards the offer:

Next, let's move on to configuring the conditions that need to be met in order to display this second block of content:

Start by adding a new set of conditions:

Then, select the "Time and date" field from the first drop-down list:

Next, proceed with the next selection:

And lastly, make sure you set the "between" condition in the third drop-down list:

The only thing left to do is to add the promotion hours:

And then save your conditions:

Now your newly created display should only be shown during the hours set by you here.

There are multiple ways in which you can use the "Conditional Display" feature when building your website. I will be linking here several articles that you might find useful, if you want to read more about how to get the most out of this feature:

This is how easily you can create an alternative display to your page content, using the "Conditional Display" feature.

I hope you found this tutorial useful. As always, if you enjoyed reading it, don't hesitate to give it a smile below :)