Age Gate

< All Topics
Widget Used
Age Gate
Tutorial Videos
Official Video

If the author wants to verify the user to show the content of your site we have done an easy-to-use and well-designed widget, that will verify the age of a user and then access to your site only if they fulfill your criteria.

Pro tip
Why not add this widget to your website/product? Because this can help you find the age at which people view the content on a website.

How to use the Age Gate Widget of The Plus Addons For Elementor

The Age Gate widget comes with three different Age verification Methods and sets the age limitation of your website or product. We can set an error message on top of the pop-up box if the user does not match age-related author criteria. You can also store Cookies for how many days you don’t have to show the pop-up user again.

General Steps

Search for the Age Gate element from the Elementor screen in the left and then drag and drop it into the content building area. After dropping the element, you will see three tabs i.e. Content, Style, and Advanced related to the Age Gate widget. First, click on the Content tab.

1. Content

Age Gate

Layout

Select Methods

The first step is an author can choose one verification method out of three from the drop-down menu.

Method 1: Age Confirmation

In this method, the submit button will be disabled by default, and if the user clicks on the check box then he will be able to click the Submit button

Credit : Gutenberg, WordPress

Method 2: Birth Date

In this method, the user will have to match the age-related criteria set by the author. Only if the user matches the criteria then the user will be able to enter the site.

Credit : Gutenberg, WordPress

Method 3: Boolean

In this method, when the user clicks on the No button, the user will get a warning message at the top of the popup box. Similarly, if the user clicks on the Yes button will the user be able to enter the Site.

Credit : Gutenberg, WordPress

Backend Visibility

Keep this disabled if you do not want that to load the widget on the editor page. If enabled you will see the widget shown on the editor.

Content

Logo

With this option, you can set your preferred image when the Logo switcher is enabled.

Title

With this option, you can set the heading of your content when the Title switcher is enabled.

Description

With this option, you can set the description of your content when the Description switcher is enabled.

Check Text

You can set the text for the checkbox when you select First Method.

Minimum Age Limit

With this option, you can set the minimum age limit of the user for your site.

Content Max-width

This option lets you set the Max Width of the button for Method Two and Third.

First Button Text

With this option, you can set the text of the button for all three methods.

First Button Icon

With this option, you can turn the button icon on or off for all three methods.

Set Icon & Icon Position (First Button)

With this option, you can choose an icon from the icon library and also set the position of the icon for all three methods.

Second Button Text

With this option, you can set the text of the button for only the third method.

Second Button Icon

With this option, you can turn the button icon on or off for only the third method.

Set Icon & Icon Position (Second Button)

With this option, you can choose an icon from the icon library and also set the position of the icon for only the third method.

Extra Info

With this option, you can set the terms and conditions of your site when the Extra Info switcher is enabled.

Error Message

With this option, you can set an error message on top of the pop-up box if the user does not match age-related author criteria.

Alignment

Set the position of your Content. By clicking the alignment, you can set it to Left, Right or Center.

Textarea Alignment

Set the position of your Textarea-related Content. By clicking the alignment, you can set it to Left, Right, or Center.

Extra Option

Background Image

With this option, you can set the background image behind the pop-up box when the background image switcher is enabled.

Background Position

With this option, Set Background Position to your Background Image behind the pop-up box. Ex. Center Center, Top Left, etc…

Overlay Color

With this option, Set Overlay Color to your Background Image behind the pop-up box.

Right Side Image

With this option, Set the Right Side image of your popup box when the Right Side image switcher is enabled.

Right Side Image Position

With this option, Set the Image Position Of the Right Side image for your popup box. Ex. Center Center, Top Left, etc…

Cookies Expiry Time

With this option, you can store Cookies for how many days you don’t have to show the pop-up to the user again when the Cookies switcher is enabled.

2. Style

The Style tab is used for customizing the look of all the Age Gate widget components such as Logo, Title, Description, Checkbox Icon/Text, Input Field, First Button, First Button Icon, Second Button, Second Button Icon, Extra Info, Error Message, and Box Background. 

Logo Style

Set Image Size. Border Radius and Margin for the Logo here.

Title Style

Set Typography, Padding, Margin, and Text color for the Title here.

Description Style

Set Typography, Padding, Margin, Text color, Background, Border and Border Radius for the Description here.

Checkbox Icon/Text Style

Set Typography, Padding, Margin, and Text color for the first method here.

Input Field Style

Set Margin, Padding, Typography, Text color, Background, Border, Border Radius, and Box shadow for the second method here.

First Button Style

Set Margin, Padding, Typography, Text color, Background, Border, Border Radius, and Box shadow for all three methods here. The method will be different But the style of the Button will be the same.

First Button Icon Style

Set Icon Size, Offset, color and Margin for all three methods here.

Second Button Style

Set Margin, Padding, Typography, Text color, Background, Border, Border Radius, and Box shadow for the third method here. The method will be different But the style of the Button will be the same.

Second Button Icon Style

Set Icon Size, Offset, color and Margin for the third method here.

Extra Info Style

Set Text Size, Typography, Padding, Margin and Text Color for the Extra Info here.

Error Message Style

Set Typography, Padding, Margin, Text color, Background, Border, Border Radius, and Box Shadow for the Error Message here.

Box Background Style

Set Box Position (Left / Right), Width, Height, Background, Border, Border Radius and Box shadow for the Box here.

3. Advanced

Advanced Tab Options are common across all the widgets. So, we have written a detailed tutorial explaining how to use these options

View The Advanced Tab Tutorial

Do you want to rate this article?
0.5 out of 5 stars
5 Stars 0%
4 Stars 0%
3 Stars 0%
2 Stars 0%
1 Stars 100%
How can we improve this article?
Need help?