Age verification code for website is necessary for some sites such as websites with adult content or cannabis related websites and dispensaries. There are various plugins to add age verification process to WordPress such as Age Gate plugin or similar plugins. But actually you don’t need a plugin to add a simple age verification and bulk up your website. Every plugin affects the speed of your website and might cause some compatibility problems with other plugins or WordPress.
I have a client who runs multiple adult toy stores and needed a website for his products and locations so I made the website but had problems with EVERY SINGLE WordPress age verification plugin I’ve tried. For some reason I was having trouble verifying the age and displaying the website properly after the age verification process. The problem might be due to the hosting but still I had to find another working solution for this issue. So I came up with a simple, light-weight code that won’t affect the speed of the website and won’t bulk up the website as in page size (it’s only 1.23KB). Once the visitor verifies their age, they won’t be asked to verify their age until they clear their cookies on their browsers. If they click on Exit button they’ll be redirected to about:blank.
Age Verification Code For Website
Age verification code for website needs to be added to footer.php right before the </body> tag if you’re running a WordPress website:
<div id="age-verify">
<div style="max-width: 350px;margin:0 auto;padding-top: 80px;text-align:center"><img src="https://img.icons8.com/flat_round/64/000000/lock--v5.png"><br><br><h2 style="color:white">Are you 21 or older?</h2><p>This website requires you to be 21 years of age or older. Please verify your age to view the content, or click Exit to leave.</p><button style="background: green" onclick="acceptCookie();">I'm over 21</button><br><a style="color:white" href="about:blank"><button style="background: #ce2c2c">Exit</button></a></div></div>
<style>#age-verify{position: fixed;z-index: 9998;top: 0;right: 0;left: 0;bottom: 0;width: 100%;height: 100%;background-color: #000;color:#fff;font-family:inherit;padding:20px;visibility:hidden}
#age-verify button{color:inherit;border:0;padding:10px;margin-top:10px;width:100%;cursor:pointer}
@media only screen and (max-width:600px){#age-verify{max-width:100%;bottom:0;left:0;border-radius:0}}</style>
<script>function acceptCookie(){document.cookie="cookieaccepted=1; expires=Thu, 18 Dec 2030 12:00:00 UTC; path=/",document.getElementById("age-verify").style.visibility="hidden"}document.cookie.indexOf("cookieaccepted")<0&&(document.getElementById("age-verify").style.visibility="visible");</script>
Here’s how it looks:
How to add it to WordPress
In order to add it to your WordPress site, go to your Appearance > Theme Editor > Theme Footer (footer.php) and paste the above code right before </body> tag.
Why use this age verification code for your website?
- You won’t need a plugin for this purpose
- It’s very light-weight (1.23KB)
- It won’t affect your page speed
- No database queries needed
- Customizable
- Responsive
- It works like a charm!