Каждый ведущий интернет-маркетолог знает, что реклама и продвижение в Интернете являются одними из лучших способов привлечения целевого трафика на ваш сайт практически без затрат. Если вы запускаете веб-сайт и отправляете рассылку своим посетителям, как вы позволите им зарегистрироваться, чтобы получить ее? Нужно ли им перемещаться по 5 страницам на вашем сайте только для того, чтобы попасть на страницу регистрации, или вы позволяете им получить их сразу после входа на ваш сайт?
Если они не видят форму регистрации, чтобы присоединиться к вашему электронному журналу, как только они приходят на ваш сайт, есть вероятность, что вы упускаете возможность захватить их адрес электронной почты все вместе. Используя простой HTML и немного JavaScript, вы можете легко получить форму регистрации там, где она должна быть, не портя впечатления посетителей на вашем сайте.
Всплывающее окно является ответом
Техника, которую я собираюсь описать, является одной из лучших, которые я когда-либо использовал, чтобы привлечь больше подписчиков на мой электронный журнал. Во-первых, это связано с созданием всплывающего окна с использованием JavaScript. Как и многие другие веб-мастера, я когда-то думал, что использование всплывающего окна ухудшает профессионализм моего сайта. Мальчик был я не прав!
Добавление простого всплывающего окна регистрации на моем сайте увеличило количество подписок на электронные журналы с 20 в день до более 100! Я не шучу.
Однако посетители не хотят, чтобы всплывающие окна раздражали их каждый раз, когда они посещают ваш сайт. Это где печенье вступают в игру. Используя куки, вы можете заставить их браузер «запоминать», если ваша страница регистрации в ezine уже отображалась. Если это так, то страница больше не будет отображаться.
Получение и настройка Cookie
Для начала нам нужно создать общие функции, которые на самом деле будут получать и устанавливать куки из браузера пользователя. Чтобы получить доступ к файлам cookie посетителя через JavaScript, мы манипулируем значением document.cookie . Он содержит все файлы cookie, которые были установлены для этого пользователя при посещении нашего сайта. Важно отметить, что мы можем получить доступ только к тем cookie-файлам, которые мы установили, а не к тем, которые установлены другими сайтами.
Файлы cookie хранятся в веб-браузере в виде простого текстового файла на компьютере посетителя. Браузер проверяет файл cookie на своем жестком диске, чтобы узнать, содержит ли он файлы cookie для нашего сайта; если это так, браузер автоматически загружает их для нас.
Каждый файл cookie хранится в виде пары имя / значение. Пример переменной document.cookie выглядит следующим образом:
myCookie=myValue;myName=Mitchell;mySite=www.devarticles.com;
Мы создадим две функции с именами setCookie и getCookie . Они создаются между тегами <script> и </script> , непосредственно перед </head> нашей HTML-страницы, например так:
<script language= "JavaScript"> function setCookie(cookieName, cookieValue, cookiePath, cookieExpires) { cookieValue = escape(cookieValue); if (cookieExpires == "") { var nowDate = new Date(); nowDate.setMonth(nowDate.getMonth() + 6); cookieExpires = nowDate.toGMTString(); } if (cookiePath != "") { cookiePath = ";Path=" + cookiePath; } document.cookie = cookieName + "=" + cookieValue + ";expires=" + cookieExpires + cookiePath; } function getCookie(name) { var cookieString = document.cookie; var index = cookieString.indexOf(name + "="); if (index == -1) { return null; } index = cookieString.indexOf("=", index) + 1; var endstr = cookieString.indexOf(";", index); if (endstr == -1) { endstr = cookieString.length; } return unescape(cookieString.substring(index, endstr)); } </script>
Функция setCookie показанная выше, принимает имя, значение, путь и срок действия файла cookie, который нужно установить. Используется так:
setCookie('myCookie', 'myValue', '', '');
Это установит cookie с именем « myCookie », который будет содержать значение « myValue ». Последние два аргумента функции setCookie — это путь к cookie и дата его истечения. Как видите, вы можете оставить два последних аргумента как '' . Функция setCookie будет использовать значения по умолчанию, если они пусты.
Функция getCookie принимает имя файла cookie для извлечения и возвращает его значение, если оно существует:
var c = getCookie('myCookie');
« c » теперь будет содержать « myValue ».
Отображение окна регистрации в Ezine
Теперь, когда мы можем получать и устанавливать файлы cookie, мы готовы фактически использовать функции setCookie и getCookie . Мы создадим функцию, которая будет проверять, установлен ли определенный файл cookie. Если это так, то мы не будем отображать всплывающее окно рассылки. С другой стороны, если файл cookie не установлен, мы отобразим всплывающую страницу ezine и установим файл cookie, чтобы указать, что форма регистрации была показана. Функция очень проста и выглядит так:
function doPopup() { var ezine = getCookie('popupShown'); setCookie('popupShown', 'true', '', ''); if(ezine == '') { // Show the popup window window.open('ezine.html', 'ezineWin', 'width=500,height=400'); } }
Функция doPopup начинается с создания новой переменной с именем ezine , которая будет содержать значение cookie « popupShown ». Независимо от того, возвращает ли функция getCookie() значение, мы устанавливаем cookie « popupShown ». Наша функция » setCookie » автоматически устанавливает период времени, в течение которого файл cookie сохраняется. Как вы можете видеть из фрагмента кода ниже (взятого из функции setCookie мы создали выше), значение по умолчанию составляет 6 месяцев:
var nowDate = new Date(); nowDate.setMonth(nowDate.getMonth() + 6); cookieExpires = nowDate.toGMTString();
popupShown cookie « popupShown » каждый раз, когда пользователь посещает эту страницу, мы гарантируем, что всплывающее окно больше никогда не будет отображаться, если они продолжают посещать сайт не реже одного раза в шесть месяцев.
Наиболее популярные времена для отображения формы регистрации — это когда пользователь переходит на другую страницу или выходит из вашего сайта. Оба эти события запускают обработчик события onUnload. Когда это происходит, мы должны указать браузеру вызвать функцию doPopup, поэтому мы изменим тег <body> следующим образом:
<body onUnload="doPopup()">
Теперь, если посетитель перейдет на другую страницу нашего сайта или закроет окно браузера, наше всплывающее окно будет отображаться в новом окне.
Вывод
Это очень простой способ привлечь больше подписчиков на ваш электронный журнал, и он будет работать как для малых, средних, так и для больших сайтов! Если вы знакомы с языком сценариев на стороне сервера, таким как ASP, PHP или JSP, то я бы порекомендовал создать форму регистрации на одном из этих языков и сохранить адреса электронной почты посетителей в базе данных вашего информационного бюллетеня, когда они нажимают на кнопка отправки.