How to Set Up Age Verification in Concept
The Age verification section in Concept displays a popup that asks customers to confirm their age before continuing to browse the store.
This section is added from the Overlay group, so it works as a hidden popup and does not appear as a normal page section.
STEPS:
Add the Age verification section
From your Shopify admin, go to Online Store > Themes.
Click Customize on the Concept theme.
Open the Overlay group in the theme editor.
Add or open the Age verification section.
This section can stay in the Overlay group because it is displayed as a popup, not as a normal section on the storefront.
Click Save after adding the section.
Configure the display behavior
Open the Age verification section settings.
Use Display mode to control how the popup behaves.
| Setting | Description |
|---|---|
| Enable | Shows the popup to customers when they have not accepted it yet. |
| Test mode | Forces the popup to appear for preview/testing, even after it has been accepted. |
Use Frequency to control how many days the popup stays hidden after the customer accepts it.
For example, if Frequency is set to 30, the popup can appear again after 30 days.
Click Save after configuring the display behavior.
Configure the popup layout
Use the layout settings to control how the Age verification popup appears.
| Setting | Description |
|---|---|
| Text alignment | Aligns the popup content to the left, center, or right. |
| Content position | Positions the popup content on desktop. Mobile layout is optimized automatically. |
| Image | Adds an optional side image to the popup on desktop. |
| Background image | Adds an optional full-screen background image behind the popup. |
| Blur image | Blurs the background image. |
Click Save after adjusting the layout.
Add the popup content
The Age verification section supports several content blocks.
Use the Heading block to add the main title, such as an age confirmation message.
Use the Text block to add supporting content below the heading.
Use the Buttons block to add the confirmation buttons.
The Buttons block includes:
| Setting | Description |
|---|---|
| Accept button label | The button customers click to confirm and close the popup. |
| Decline button label | The button or link customers can click if they do not confirm. |
| Decline button link | The URL used for the decline action. |
| Open in new window | Opens the decline link in a new browser tab. |
You can also add optional Icon, Image, Custom liquid, or Empty space blocks to customize the popup content.
Click Save after adding the content blocks.
Customize colors
Open the color settings inside the Age verification section.
You can customize the popup colors using these settings:
| Setting | Description |
|---|---|
| Text | Changes the popup text color. |
| Background | Changes the popup content background color. |
| Highlight | Changes the highlighted text color. |
| Button text | Changes the button text color. |
| Button background | Changes the button background color. |
| Button gradient | Adds a gradient background to the button. |
| Overlay | Changes the overlay color behind the popup. |
Click Save after updating the colors.
Preview the Age verification popup
Switch Display mode to Test mode while editing the popup.
Open the storefront preview.
Check the popup content, buttons, images, colors, and mobile layout.
After confirming the design, switch Display mode back to Enable.
Click Save.
Notes
- The Age verification section is added from the Overlay group.
- The popup appears only when the customer has not accepted it yet, unless Test mode is enabled.
- The accept button closes the popup and stores the confirmation in a browser cookie.
- The Frequency setting controls how long the confirmation cookie lasts.
- The decline button can link customers to another page or external URL.
- The side image is shown on desktop only.
- The background image can be displayed behind the popup and blurred if needed.
Troubleshooting
If the popup does not appear, check the following:
- The Age verification section has been added to the Overlay group.
- Display mode is set to Enable or Test mode.
- The customer has not already accepted the popup in the same browser.
- Use Test mode to preview the popup again while editing.
- Clear browser cookies or test in a private window if you need to see the popup again.
If the accept button does not close the popup, check the following:
- The Buttons block exists in the Age verification section.
- The Accept button label is not empty.
- The theme has been saved after editing the section.
If the image does not appear on mobile, this is expected behavior. The side image is designed for desktop only.
Need Further Assistance
If you encounter any issues or need additional help with your Concept theme, please reach out to our support team via our Ticket System for assistance within 8 hours.
Share:
How to add a Help Drawer to Product Pages in Concept theme