{"id":6818,"date":"2025-02-06T02:00:00","date_gmt":"2025-02-06T02:00:00","guid":{"rendered":"https:\/\/meetanshi.com\/blog\/?p=6818"},"modified":"2025-05-26T14:42:25","modified_gmt":"2025-05-26T09:12:25","slug":"shopify-age-verification-popup-code","status":"publish","type":"post","link":"https:\/\/meetanshi.com\/blog\/shopify-age-verification-popup-code\/","title":{"rendered":"Shopify Age Verification Popup Code [+How to Use it?]"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">A Shopify age verification popup is a simple way to grant shoppers access to your store based on age.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you are <a href=\"https:\/\/meetanshi.com\/blog\/best-shopify-apps-for-accessibility\/\">making your store accessible<\/a> to certain countries, this becomes essential to abide by their laws. Learn here the direct steps on how to add age verification to Shopify without any complications.\u00a0<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How Does Age Verification Popup Work in Shopify?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">An age verification popup on Shopify appears when the user visits your site for the first time.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Something like this:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"736\" height=\"574\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview.png\" alt=\"Shopify Age Verification Preview\" class=\"wp-image-6821\" srcset=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview.png 736w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview-250x195.png 250w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview-700x546.png 700w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview-403x314.png 403w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/1-Shopify-Age-Verification-Preview-120x94.png 120w\" sizes=\"auto, (max-width: 736px) 100vw, 736px\" \/><\/figure>\n<\/div>\n\n\n<ul class=\"wp-block-list\">\n<li>When they select Yes, then they can explore your site&nbsp;<\/li>\n\n\n\n<li>When they select No, they are redirected back to Google.com<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">When the users accept they are above the needed age limit, the age verification popup will not appear during the entire session.&nbsp;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How to Add Age Verification to Shopify?<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Step 1: Head to Theme Editor&nbsp;&nbsp;<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">From your Shopify admin panel, head to Online Store &gt; Themes.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"345\" height=\"253\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/2-Head-to-Theme-Editor.png\" alt=\"Head to Theme Editor\" class=\"wp-image-6823\" srcset=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/2-Head-to-Theme-Editor.png 345w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/2-Head-to-Theme-Editor-250x183.png 250w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/2-Head-to-Theme-Editor-120x88.png 120w\" sizes=\"auto, (max-width: 345px) 100vw, 345px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">Click on the three dots and open the <strong>Edit code<\/strong>.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"643\" height=\"340\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/3-Click-Three-Dots-and-Click-Edit-Code.png\" alt=\"Click Three Dots and Click Edit Code\" class=\"wp-image-6825\" srcset=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/3-Click-Three-Dots-and-Click-Edit-Code.png 643w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/3-Click-Three-Dots-and-Click-Edit-Code-250x132.png 250w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/3-Click-Three-Dots-and-Click-Edit-Code-403x213.png 403w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/3-Click-Three-Dots-and-Click-Edit-Code-120x63.png 120w\" sizes=\"auto, (max-width: 643px) 100vw, 643px\" \/><\/figure>\n<\/div>\n\n\n<h3 class=\"wp-block-heading\">Step 2: Add the Age Verification Code<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Open the theme.liquid file and add the following age verification code before the closing &lt;\/body&gt; tag. You can modify the content and text as per your preferences.<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;!-- Meetanshi Age Verification Popup Starts -->\n&lt;div id=\"age-verification-popup\" style=\"display:none; position:fixed; top:0; left:0; width:100%; height:100%; backdrop-filter:blur(10px); background-color:rgba(0, 0, 0, 0.8); z-index:9999;\">\n  &lt;div style=\"position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background-color:#fff; padding:30px; text-align:center; border-radius:15px; max-width:400px; width:90%; box-shadow:0px 8px 16px rgba(0,0,0,0.3);\">\n    &lt;h2 style=\"font-size:26px; margin-bottom:20px; color:#ff6f61;\">Age Verification&lt;\/h2>\n    &lt;p style=\"font-size:18px; margin-bottom:20px; color:#444;\">\n      You must be &lt;strong>18 years or older&lt;\/strong> to access this site. Please confirm your age below.\n    &lt;\/p>\n    &lt;button onclick=\"verifyAge(true)\" style=\"background-color:#28a745; color:#fff; padding:12px 25px; border:none; border-radius:30px; cursor:pointer; font-size:16px; font-weight:bold; margin-right:10px; transition:background-color 0.3s;\">Yes, I'm 18+&lt;\/button>\n    &lt;button onclick=\"verifyAge(false)\" style=\"background-color:#dc3545; color:#fff; padding:12px 25px; border:none; border-radius:30px; cursor:pointer; font-size:16px; font-weight:bold; transition:background-color 0.3s;\">No&lt;\/button>\n    &lt;p style=\"font-size:14px; margin-top:20px; color:#888;\">\n      By continuing, you agree to our &lt;a href=\"\/terms\" style=\"color:#007bff; text-decoration:none; font-weight:bold;\">Terms &amp; Conditions&lt;\/a>.\n    &lt;\/p>\n  &lt;\/div>\n&lt;\/div>\n\n&lt;script>\n  document.addEventListener(\"DOMContentLoaded\", function () {\n    const agePopup = document.getElementById(\"age-verification-popup\");\n\n    \/\/ Show the popup if sessionStorage does not have the flag\n    if (!sessionStorage.getItem(\"ageVerified\")) {\n      agePopup.style.display = \"block\";\n    }\n  });\n\n  function verifyAge(isOfAge) {\n    const agePopup = document.getElementById(\"age-verification-popup\");\n    const referrer = document.referrer;\n\n    if (isOfAge) {\n      \/\/ Set session-based flag\n      sessionStorage.setItem(\"ageVerified\", \"true\");\n      agePopup.style.display = \"none\";\n    } else {\n      \/\/ Check if the referrer is not Google, then redirect back to the referrer\n      if (referrer &amp;&amp; !referrer.includes(\"google.com\")) {\n        window.location.href = referrer;\n      } else {\n        \/\/ Redirect to a custom URL for users under 18\n        window.location.href = \"https:\/\/google.com\"; \/\/ Replace with your custom URL\n      }\n    }\n  }\n&lt;\/script>\n&lt;!-- Meetanshi Age Verification Popup Ends -->\n<\/pre>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1928\" height=\"1056\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save.png\" alt=\"Add the Age Verification Code Click Save\" class=\"wp-image-6827\" srcset=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save.png 1928w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-250x137.png 250w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-700x383.png 700w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-768x421.png 768w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-1536x841.png 1536w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-403x221.png 403w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-964x528.png 964w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/4-Add-the-Age-Verification-Code-Click-Save-120x66.png 120w\" sizes=\"auto, (max-width: 1928px) 100vw, 1928px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">And click <strong>Save<\/strong> and finish the process.&nbsp;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This will add the age verification popup to the entire Shopify store.&nbsp; A new user will first get the age verification popup, and based on the action they take, they will continue accordingly.&nbsp;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1235\" height=\"701\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend.png\" alt=\"Age Verification Pop Up on Frontend\" class=\"wp-image-6829\" srcset=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend.png 1235w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-250x142.png 250w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-700x397.png 700w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-768x436.png 768w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-403x229.png 403w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-964x547.png 964w, https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2025\/02\/5-Age-Verification-Pop-up-on-Frontend-120x68.png 120w\" sizes=\"auto, (max-width: 1235px) 100vw, 1235px\" \/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\">This code is fully functional across devices and optimized for better UX, so you must not worry about any issues or disturbances in your core file.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Give this simple code a try and get the needed age verification&nbsp; access in your Shopify store for free.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A Shopify age verification popup is a simple way to grant shoppers access to your store based on age.&nbsp; If you are making your store accessible to certain countries, this becomes essential to abide by their laws. Learn here the direct steps on how to add age verification to Shopify without any complications.\u00a0 How Does [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":6834,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[787],"tags":[],"class_list":["post-6818","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-shopify"],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/6818","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=6818"}],"version-history":[{"count":4,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/6818\/revisions"}],"predecessor-version":[{"id":15969,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/6818\/revisions\/15969"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media\/6834"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=6818"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=6818"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=6818"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}