Age Gate Replacement Popup [Settings Resolved]

[intcultcom]

I’m really happy with my Popup now:

And I’m trying to work out the conditions to make it popup on every page, block the site until they click on “Yes” and then never popup again.

So I’ve got it set to show up 1s after content loaded in Template settings > Popup > Interactions:

I’ve got it set up to show on the entire website in Template Settings > Conditions:

And I the “Yes” button I’ve got it set to hide the Popup Element on click:

Are you seeing it? I’m not seeing it:

liquorpot.co.kr

It’s a no-show. What do you think I’m doing wrong here?

[intcultcom]

Okay, so I solved it with a couple of changes - that I should have figured out in the first place I guess.

1. I had to set the Template settings > Interactions to “Show Element” , not “Hide Element” (Duh.):
   
   

Then I had to set Template settings > POPUP LIMIT > Across sessions to 1:

And I now have my simple Age Gate replacement that makes the site MUCH more accessible!

If this helped you, please give me a “Like” or a “Reply” to encourage me to write answers to my own questions in the future too. Thanks!

[10gital]

Hi, thanks for replying to your own questions
I can’t stand the Age Gate plugin anymore (conflicts with GDPR Popup, cookies issues…)

[mealdeal]

I’ve got a similar popup to this but mine has 2 buttons. 1 to say, yes I’m over 18, the other to say no I’m under 18. The problem is, if I click no and then refresh the page, the popup no longer appears because sessions is set to 1.

How can I make it so clicking no and reloading the page will show the popup again?

[SinjoriS]

@intcultcom , Have you tried to refresh the page?
It’s not good solution, because anyone can bypass the age verification just by refreshing the page. You don’t have to click on the button. Refreshing the page will do the same.
So, the solution (that way) is useless, unfortunately.

[vinicius]

I worked on a solution for this that I think works well. It’s a combination of using a cookie and session storage.

In my case, I wanted the age gate popup to display until the user clicks “Yes” (confirming they’re over 21), and for that confirmation to persist for a week.

I initially wanted to use Bricks’ native Browser Storage condition to control the popup, but since there’s no way to set an expiration for that, I had to rely on a cookie instead to handle the timing. Bricks doesn’t allow checking cookie values directly in the popup conditions, though — only session or local storage.

So, here’s what I did:

1) Created two interactions for the “Yes” button:

• One to set the cookie: set-cookie.png - Droplr
• One to close the popup: close-popup.png - Droplr

2) In the Bricks body footer scripts, I added this code:

<script>
function setAgeVerifierCookie() {
  const now = new Date();
  now.setTime(now.getTime() + (7 * 24 * 60 * 60 * 1000)); // 7 days
  document.cookie = "age_verifier=1; expires=" + now.toUTCString() + "; path=/";
}

function getCookie(name) {
  const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  return match ? match[2] : null;
}

document.addEventListener("DOMContentLoaded", function () {
  if (getCookie("age_verifier") === "1") {
    sessionStorage.setItem("age_verified", "1");
  }
});
</script>

What this code does:

• When the page loads, it checks if the age_verifier cookie exists and has value 1.
• If it does, it sets a session storage key called age_verified with the same value.
• This way, you can use Bricks’ built-in condition to check for sessionStorage instead of cookies (which Bricks doesn’t support directly).
• After a week, when the cookie isn’t there anymore, the session storage key won’t be created and the popup will be triggered and displayed again.

3) Set all the popup interaction conditions:

This setup works well for me. Hope it helps you guys too! Let me know if you find any mistakes in this logic.