UPDATE 12/5/2016: If you’re going to attempt to integrate this into the WordPress platform, please consider using my WP Drinking Age Plugin.
So outside the normal grind I’ve been working on a website for a tequila brand. After a meeting with marketing I’d gathered it was important to add a drinking age gateway to the site. You see some type of these gateways on just about every alcohol brand’s site. I asked if they’d prefer to simply ask “Are you of Legal Drinking Age?”, and then have “Yes/No” buttons determine a user’s fate (1)(2), or if they’d rather have the user input their birthday (3). Apparently, and I’m not a business guy or a lawyer so don’t comment and argue this with me, the yes/no gateways hold slightly less legitimacy than the ones where a user inputs their birthday to enter the site .
All countries don’t have the same drinking age. So solutions where the gateway is based on a static entry age aren’t viable. An age, and location must be gathered by the gateway to determine if a user is credible to enter the site. Tequila in Mexico is legal 3 years earlier than California. Sites that implemented this type of gateway (1) seemed to POST location values with country codes “US” “CA” ,ect. So they were authenticating server side with these codes…ugh
I’d Googled long enough to determine the few hours spent writing this script were likely more fun than just searching for an existing solution to work with, because it didn’t jump out at me.
- Download the dependencies of Bootstrap and jQuery
- Get the Source drinkingAge
- Place bouncer.css in site’s head
<link href="css/bouncer.css" rel="stylesheet">
- Place bouncer.js before the close of the body
- Initialize the gateway and its settings
Putting that all together in the most basic form you should have this.
The bouncer.css file allows you to change just about everything that has to do with the gateway. I’m not a wizard with style sheets and this is a demo…so you’ll want to change things here.
Reference for Legal Drinking Ages