Содержит ли ваш сайт товары для взрослых или контент, требующий всплывающего окна с проверкой возраста? Многие службы проверки возраста могут быть трудоемкими и дорогими для того, что они предлагают.
Итак, сегодня мы покажем вам, как с помощью OptinMonster создать собственное всплывающее окно подтверждения возраста менее чем за 10 минут.
В конце этого руководства вы сможете проверять возраст ваших клиентов при каждом доступе к вашему сайту.
Но сначала давайте поговорим о том, что мы подразумеваем под «всплывающим окном проверки возраста».
Что такое всплывающее окно подтверждения возраста?
Всплывающее окно подтверждения возраста – это всплывающая кампания, которая отображается для посетителей, чтобы убедиться, что они достаточно взрослые, чтобы перемещаться по контенту на вашем сайте. Компании, которые продают табак, алкоголь, каннабис или другие продукты для взрослых, используют проверку, чтобы посетители своего сайта могли просматривать их содержание на законных основаниях (и безопасно).
Цель проверки возраста – обеспечить, чтобы продавцы, продающие товары для взрослых, не рекламировали несовершеннолетних.
И хотя некоторые компании делают страницы проверки возраста для своего сайта, другие предпочитают простое всплывающее окно подтверждения возраста.
Вы, наверное, уже сталкивались с этими сообщениями проверки возраста. Они выглядят так:
Многие компании добавляют всплывающие окна проверки возраста по моральным и юридическим причинам.
С помощью всплывающего окна подтверждения возраста вы можете покрыть свои базы, чтобы избежать штрафов или штрафов, если на вашем сайте обнаруживаются мошеннические покупки.
И хотя законы о проверке возраста вашего пользователя будут различаться в зависимости от того, где вы живете, добавление проверки возраста на веб-сайты не составляет труда для тех, кто работает с продуктами для взрослых.
2 способа создать всплывающее окно подтверждения возраста
В этом пошаговом руководстве мы покажем вам 2 разных способа создания всплывающего окна проверки возраста.
Метод 1: простая проверка возраста (да / нет)
Способ 2: проверка возраста путем отправки даты рождения
Начнем.
Метод 1: простое всплывающее окно подтверждения возраста (да / нет)
Мы будем использовать OptinMonster для создания всплывающего окна подтверждения возраста.
Без сомнения, OptinMonster – это лучший на рынке набор инструментов для конверсии, который позволяет легко настроить любую кампанию на сайте, включая всплывающее окно подтверждения возраста, форму генерации потенциальных клиентов и многое другое.
Он имеет мощные возможности таргетинга, поэтому вы можете быть уверены, что ваши кампании будут показаны нужным людям на нужных страницах в нужное время.
Шаг 1: Создать всплывающее окно Да / Нет
Сначала вам необходимо войти в свою учетную запись OptinMonster:
На панели инструментов перейдите в верхний правый угол и нажмите Создать новую кампанию:
Затем выберите свой тип кампании. Существует два типа кампаний для проверки возраста:
Я люблю или ненавижу их, вы просто не можете отрицать, что всплывающие окна работают.
Вот почему вы видите так много известных брендов, использующих всплывающие окна для проверки возраста, рекламных кампаний и многого другого.
Кроме того, вы также можете создать полноэкранную кампанию, которая является наилучшим вариантом, особенно если вы ограничиваете только определенные пути URL на своем сайте.
Однако для сегодняшнего урока мы выберем возникать:
Сейчас самое время выбрать свой шаблон. OptinMonster поставляется с 50 готовыми шаблонами, которые работают как для настольных компьютеров, планшетов и мобильных устройств. Или вы также можете создать свой собственный шаблон с нуля.
Сегодня мы используем основной модель:
Это простой, не отвлекающий внимание всплывающий шаблон, который идеально подходит для проверки возраста посетителей вашего сайта.
Затем вам нужно назвать свою кампанию и выбрать, для какого сайта вы хотите ее использовать:
Теперь вы увидите свой шаблон в редакторе. С помощью нескольких незначительных настроек ваше всплывающее окно подтверждения возраста появится в кратчайшие сроки.
Перейдите в верхнюю часть меню редактора и нажмите Если не:
Затем нажмите Активировать вид в вашем редакторе:
Это активирует Если не особенность, обычно используемая для наших двухступенчатых форм. Тем не менее, они также полезны для проверки возраста ваших посетителей.
Нажмите на текст в редакторе, чтобы открыть инструменты редактирования в левом боковом меню. Измените текст, чтобы спросить посетителя, старше ли он возраста, необходимого для просмотра информации на вашем сайте:
Мы также удалим подтекст из нашей кампании по проверке возраста. Для этого щелкните значок мусорного ведра подтекста прямо в редакторе:
Теперь нам нужно отредактировать наш Если не опции.
У вас уже есть да а также нет кнопки созданы. Если вы хотите, вы можете изменить внешний вид этих кнопок в соответствии с вашим брендом. Просто нажмите кнопку, чтобы открыть инструменты редактирования в меню слева:
Вы можете изменить кнопку:
- Цвет
- Текст
- Источник
- Тень
- бордюр
И более. С помощью OptinMonster наша миссия состоит в том, чтобы вы могли настроить каждое всплывающее окно в соответствии со своими конкретными потребностями.
Сегодня мы изменим наш да а также нет текст кнопки проще, чем в шаблоне. Нам просто нужно, чтобы они сказали «Да» или «Нет» для нашего всплывающего окна проверки возраста.
Нажмите кнопку, которую хотите отредактировать, и найдите Текстовая кнопка сельская местность. Затем измените то, что вы хотите да Кнопка сказать:
Нажмите ваш Нет кнопки и найти Текстовая кнопка изменить это тоже:
Теперь у вас должно быть простое Если не Кампания в вашем редакторе:
Шаг 2: сделать проверку возраста обязательной
Обратите внимание, что есть еще Икс Кнопка закрытия в правом верхнем углу кампании:
Мы не хотим, чтобы оно появилось в нашем всплывающем окне подтверждения возраста.
Единственный способ закрыть эту кампанию, если пользователь нажимает да потому что они достаточно взрослые, чтобы войти на ваш сайт. На данный момент, нажмите на Икс закройте предмет в верхнем правом углу и найдите Показать кнопку закрытия в меню редактирования слева:
Поменяйте рычаг на Off:
Сейчас настало время изменить свой да а также Нет кнопок “ действие. Давайте начнем с да кнопка.
Нажать на да Кнопка, чтобы открыть параметры редактирования в меню на левой стороне. Прокрутите вниз до действие:
В раскрывающемся меню для Действие нажатия кнопки, измените настройки Перейти к просмотру в Закрыть кампанию:
Таким образом, когда посетители вашего сайта отвечают да Если они соответствуют возрастным требованиям или нет, всплывающее окно автоматически закроется, и они смогут получить доступ к вашему сайту.
Теперь настало время изменить Нет кнопок действие. Нажать на нет кнопка, чтобы открыть инструменты редактирования. Прокрутите вниз до действие:
В раскрывающемся меню для Действие нажатия кнопки, измените настройки Закрыть кампанию в Перенаправить на URL:
Введите URL, на который вы хотите, чтобы ваш посетитель был перенаправлен в поле ниже:
Вы можете выбрать любой URL, который вы хотите. Если у вас есть другой контент или другой сайт, который не ограничен по возрасту, вы можете отправлять туда посетителей.
В противном случае ваши посетители возвращаются в Google.
Мы почти закончили.
Затем нам нужно настроить наш экран и параметры активации, чтобы убедиться, что всплывающее окно подтверждения возраста показывается нужным людям и на нужных страницах.
Шаг 3: Показать всплывающее окно подтверждения возраста для каждого пользователя
В меню слева нажмите Настройки экрана:
Первый вариант полезен для рекламных кампаний. Настройки по умолчанию не будут отображать одно и то же всплывающее окно в течение 30 дней для посетителей, которые не выбрали вашу форму:
Но это необязательная форма, поэтому мы хотим это изменить.
В раскрывающемся меню измените это поле с после X дней в при следующем посещении сайта:
И это так! Ваша кампания по проверке возраста будет показываться каждому посетителю каждый раз, когда вы посещаете ваш сайт.
Шаг 4: показать всплывающее окно немедленно
В верхней части меню редактора нажмите Правила отображения:
Как правило, мы не рекомендуем пользователям сразу же показывать свои всплывающие окна. Наши настройки по умолчанию покажут кампанию вашим посетителям после первых 5 секунд пребывания на вашей странице.
Но во многих случаях мы рекомендуем показывать кампании, когда пользователи покидают ваш сайт с нашей технологией Exit-Intent®.
Однако сегодня вам нужно сделать прямо противоположное,
Оставьте первое условие как время на странице но измените поле рядом с По крайней мере в немедленно:
Это означает, что ваше всплывающее окно появится, как только кто-то достигнет вашего сайта.
Следующий шаг будет необязательным, в зависимости от ваших потребностей. В настоящее время настройки по умолчанию будут отображать вашу всплывающую кампанию на любой странице. Однако вы можете изменить это, если только определенные страницы на вашем сайте имеют возрастные ограничения.
Для этого вы можете оставить опцию текущий URL-путь как есть, но меняет поле любая страница в точно соответствует:
Затем вам нужно ввести URL страницы с ограничением по возрасту на вашем сайте:
Чтобы добавить больше страниц, нажмите на А ТАКЖЕ Нажмите кнопку и заново создайте правило отображения, которое вы только что создали, с другим URL:
Если у вас есть целые разделы вашего сайта, которые должны быть ограничены, вы можете изменить поле любая страница в содержит:
Затем введите часть URL-адреса пули, в которую вы хотите включить проверку возраста.
Так что, если все ваши сообщения в блоге начинаются с пути URL www.mysite.com/blogВы бы добавили термин Блог в поле рядом с содержит:
Тогда любой URL, содержащий термин Блог отобразит всплывающее окно подтверждения возраста.
И теперь, когда вы сделали! Ну, почти.
Не забудьте нажать Сохранить а также Для публикации.😉
Теперь вы используете OptinMonster в качестве бесплатной службы проверки возраста, чтобы гарантировать, что продукт и контент на вашем сайте достигнут нужной аудитории. Это будет отображаться каждый раз, когда посетитель посещает ваш сайт, и будет отображаться немедленно.
Способ 2: проверка возраста путем отправки даты рождения
Возможно, вы заметили, что на некоторых веб-сайтах всплывающее окно подтверждения возраста запрашивает у пользователей дату рождения:
В некоторых штатах или регионах может потребоваться это сделать. Вопрос всегда был “Как?”
Сегодня мы собираемся быстро поделиться некоторым пользовательским кодом, который вы можете использовать для создания такого рода старого всплывающего окна проверки с OptinMonster.
Если вы не знакомы с HTML, CSS или JavaScript, не беспокойтесь. Все, что вам нужно знать, это как копировать и вставлять.
Как и раньше, войдите в свою учетную запись OptinMonster и создайте всплывающую кампанию. Но на этот раз выберите холст Шаблон для начала с нуля:
Затем назовите свою кампанию и назначьте ее веб-сайту. Ваш редактор должен выглядеть следующим образом:
Первое, что вы должны сделать, это удалить Икс Кнопка закрытия для этого шаблона, как мы делали ранее в этом уроке. Нажать на Икс закройте элемент кнопки и найдите тумблер:
Поменяйте рычаг на от:
Теперь перейдите в верхнее меню вашего редактора и нажмите + Добавить блоки:
В меню слева вы увидите различные варианты элементов блока. Прокрутите вниз, пока не найдете HTML:
Перетащите этот блок на экран вашего редактора. Теперь вы увидите место для вставки пользовательского HTML в левом меню:
Удалите код, который есть в данный момент, и замените его следующим HTML-кодом:
HTML
На этом этапе ваша кампания будет выглядеть немного странно. Не волнуйся, это нормально. Потому что дальше нам нужно добавить CSS.
CSS
Нажать на жилой дом значок, чтобы вернуться к вашим инструментам редактирования:
Затем нажмите Настройки экрана:
И прокрутите вниз, пока не увидите поле кода CSS:
Скопируйте и вставьте следующий код в это поле:
Вы увидите, что поля ввода вашего дня рождения были разработаны:
Нажмите кнопку Назад в верхней части меню слева, рядом с Персонализированные CSS:
И нажмите Персонализированные JavaScript:
JavaScript
Скопируйте и вставьте следующий код JavaScript:
И поместите это в поле кода в вашем редакторе:
Единственный раздел этого кода, который вам нужно знать, это:
Вы можете изменить «18» на «21» (или любой возраст) в зависимости от продукта, содержания и местных законов вашего сайта. Это изменит всплывающее окно, чтобы разрешить вход пользователям старше 21 года, а не до 18 лет, как сейчас.
Теперь вам просто нужно привести дизайн в соответствие с вашим брендом. Удалите лишние блоки элементов из вашей кампании, используя значок корзины прямо в редакторе:
Как только вы удалите все лишние блоки, ваша кампания останется простой:
Чтобы это исправить, измените цвет фона. Нажмите на нижнюю часть вашей кампании, чтобы открыть инструменты редактирования. Чтобы найти фоновый цвет:
Мы предлагаем использовать цветной код «000000» для создания черного фона:
Это также будет отображать текст Пожалуйста, подтвердите вашу дату рождения это пусто (вот почему мы не могли видеть это раньше).
И вуаля, теперь у вас есть всплывающее окно расширенной проверки возраста, которое позволяет вам ввести дату рождения вашего посетителя. Если они не достаточно взрослые, чтобы посетить ваш сайт, они получат сообщение Сожалею! У вас нет разрешения на вход:
Ох, и снова не забудьте ударить Сохранить а также Для публикации, 😉
Вам нужно будет настроить свои правила отображения и триггеры так же, как мы это делали в первой половине этого урока. В противном случае все готово.
Теперь вы можете быть уверены в том, что посетителям вашего сайта необходим возраст для просмотра вашего контента.
В заключении
Это! Вы только что узнали, как с легкостью добавить проверку возраста на ваш сайт.
Есть ли у вас отличные советы или рекомендации для проверки возраста пользователей вашего сайта? Если это так, пожалуйста, сообщите нам об этом в разделе комментариев ниже. Вы также можете посмотреть, как использовать закрытый контент для запуска конверсий.
А для получения дополнительных экспертных советов о том, как увеличить трафик, увеличить количество конверсий и увеличить продажи, посетите наш канал YouTube. У нас есть тонны учебников для всех ваших потребностей цифрового маркетинга.
Устали от теории и готовы пойти? Это то, что мы любим слышать.
Зарегистрируйтесь в OptinMonster сегодня, без риска с нашей 14-дневной гарантией возврата денег и начните развивать свой бизнес сегодня.
