Skip to main content
All CollectionsAdvanced
Display a Popup Only After Another One Has Been Seen (or Clicked)
Display a Popup Only After Another One Has Been Seen (or Clicked)
Updated over 3 months ago

In some situations, it might be useful to condition the appearance of a popup on the status of another popup. Consider the following use case:

  • Display a bottom bar that states that our shop will be closed during the holidays. We want the visitor to see the information before anything else is displayed.

  • Afterwards, a popup featuring our new collection is displayed.

We will make use of our JS callbacks and custom properties to recall when the closing announcement has been seen.

Step 1:

Create a custom property closedMessageSeen that stores the current date when our bottom bar is displayed. To do so, you must create a new JS callback that listens for the event Before popup display, with the following script:

event.detail.wisepops('properties', {
closedMessageSeen: new Date()
});

Step 2:

Ensure that the bottom bar is configured to be displayed only once:

Step 3:

We now want to configure the display of our second popup, about featuring the new collection. We want it to be displayed only when the custom property closedMessageSeen has been set.

In the editor of this second popup, create a new custom property rule:

closedMessageSeen exists.

That's it!

Keep displaying the message about holidays until it is acknowledged:

We can also keep displaying the bottom bar until the visitor clicks on a CTA "OK":

  • Create the CTA, and ensure that it has the "Track clicks" option enabled

  • Listen for the event "After tracked click" to create the custom property

  • Change the bottom bar frequency to stop the display when it is clicked

If you need any further help, get in touch with our Customer Support team.

Did this answer your question?