Age gate

A full-screen dialog asking the visitor to confirm they’re old enough, with no way past it except answering. Off by default.

Settings

Setting	Type	Default	What it does
Enabled	Checkbox	Off	Turns the gate on
Remember for	Range	30	How long an answer is remembered on that device
Version	Text	1	Change this to ask everyone again
Logo	Image	(empty)	Falls back to the brand wordmark
Heading	Inline rich text	Are you old enough?
Text	Text	Legal-age line
Confirm label	Text	I am old enough
Decline label	Text	Take me back
Decline goes to	URL	(empty)	Where someone under age is sent. Defaults to a search engine
Note	Text	(empty)	Small print under the buttons

It blocks on purpose

Unlike the promo popup, this one cannot be dismissed:

• There is no close button.
• Escape is cancelled — pressing it does nothing.
• The backdrop is inert — clicking outside does nothing.

That’s what makes it a gate rather than a suggestion. It also means two things have to be right, or it becomes a trap.

It’s opened by script, never rendered open

The dialog starts closed and is opened by a script. If that script never runs — an error, a blocked asset, a browser that can’t — the visitor sees the site instead of a permanent blank page they have no way to answer.

A gate that cannot be answered is worse than no gate.

Declining goes somewhere real

decline_url is where an under-age visitor is sent. Leave it empty and they go to a search engine. Either way it’s a working destination, never a dead end or a blank page.

It’s rendered from the layout

Not from a template. An age gate that only covers the homepage is bypassed by any link straight to a product — an ad, a shared URL, a search result. Rendering it from the layout means every page carries it.

It stays fully editable in the theme editor like any other section.

How the answer is remembered

Confirming is remembered by the shopper’s browser, with an expiry date and under a name that includes the Version setting — so changing the version asks everyone again. While the confirmation is still in the future, the gate doesn’t open.

• remember_days sets how long. 30 days is the default.
• version is the reset. Bump it from 1 to 2 and every previously-confirmed device is asked again — useful if your legal requirement changes, or if you need to re-verify after a policy update.

Caution

Remembering is per device and per browser, in local storage. A shopper in a private window, or one who clears site data, is asked again. There is no way for a theme to tie this to an account — and no way for it to be a legally robust age check. Treat it as the notice it is, and take advice if your category is regulated.

Accessibility

• A real <dialog> opened with showModal(), so the browser supplies the focus trap and the top layer.
• aria-labelledby points at the heading.
• Focus is moved to the confirm button when it opens, so a keyboard user can answer with one keypress.
• Page scroll is locked while it’s open.
• The decline control is a real link, so it’s reachable by keyboard and announced as a navigation.

Tip

Keep the copy short and the confirm button unambiguous. A gate is friction on the first impression of every visit — every extra line of legal text is a visitor who leaves before reading it.