Геотаргетинг для лендинга

Геотаргетинг для лендингаПривет друзья. Сегодня буду размышлять на тему геотаргетинга для лендинга. Долго выбирал тему для статьи, так как хотел рассказать о чем-то особенном. В последние дни больше писал о социальных сетях (и некоторые сервисы меня действительно впечатлили, например, socbox), а сегодня хотелось написать о чем-то еще более полезном для повышения конверсии.

Итак, давайте сначала поясню, что же такое геотаргетинг. Применимо к вебу, геотаргетинг - это метод выдачи посетителю содержимого сайта, соответствующего его географическому положению. Это значит, что если пользователь из Москвы, то ему показывается телефонный номер Московского офиса компании.

Это можно использовать и по-другому, например, менять адрес доставки, подгружать соответствующие картинки и полностью менять контент страницы. Конечно не все так просто, нужны определенные знания и необходимо понимать еще несколько моментов, о которых мы поговорим ниже.

Наверняка, многие из вас уже используют геотаргетинг на своих посадочных страницах, но для многих, думаю, реализация подобного эффекта остается загадкой. Сегодня мы это поправим 🙂

Скрипт геотаргетинга для landing page

Для умельцев и людей "в теме", хочу сказать, что мы не будем выкачивать или покупать никаких баз данных с ip регионов и городов, а пойдем более простым путем - воспользуемся API Яндекс карт и jQuery. Сказано - сделано. Подключаем jQuery:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

А теперь API:

<script charset="utf-8" src="http://api-maps.yandex.ru/1.1/index.xml" type="text/javascript"></script>

Далее нам понадобятся базовые знания javascript. Информация о местоположении пользователя хранятся в объекте YMaps.location и нам доступны такие поля:

  • country - название страны.
  • region - название региона;
  • city - название города;

Вообще, доступно больше полей, но это основные, которые могут нам понадобиться. Я постараюсь показать несколько вариантов того, как можно использовать геотаргетинг, а вы по аналогии, если не очень разбираетесь в javascript уже сделаете под свои нужды. Так как я и сам, не очень знаю js, то буду рад поучиться у профи и получить конструктивную критику и комментарии по поводу того как улучшить скрипт.

Предлагаю начать с изменения номера телефона, в зависимости от региона, в котором находиться пользователь. Для примера рассмотрим несколько регионов, а именно, Московскую и Донецкую область. Если пользователь окажется из другого региона, то покажем третий номер, предназначенный как раз для такого случая.

<script>
    $(document).ready(function() {
        if (YMaps.location.region != '') {
            var youRegion = (YMaps.location.region);
            if (youRegion === "Донецкая область"){
                $('.contact p span').text('+3 06252 5 19 41');
            }
            else if (youRegion === "Московская область"){
                $('.contact p span').text('+7 449 000 00 00');
            }
            else {
                $('.contact p span').text('+0 000 000 00 00');
            }
        }
    });
</script>

Теперь постараюсь его немного объяснить. Итак, после того, как наша страничка открыта я пишу условие:

  • Если мы получили регион пользователя, то сохраним данные в переменную.
  • Если этот регион Донецкая область, то поместим в класс .contact > p > span заданный номер телефона для этого случая.
  • Если первое условие не выполнено и регион не Донецкая область, то проверить не Московская ли это область. Если Московская, то вывести номер с кодом +7 449, если нет, то все условия не выполнены и нужно показать номер по умолчанию.

Вот таким не хитрым способом можно показывать определенный номер телефона в зависимости о гео положения пользователя и тем самым увеличивать конверсию.

Аналогичным образом можно, например, подменять Адрес доставки или ваши Дескрипторы, ориентированные на город или регион пользователя:

  • Бесплатная доставка по Москве и Московской области (Донецку и Донецкой области) и так далее.

Конечно, учесть все города достаточно накладно и проблематично. Кроме того, даже если учесть все основные города России, то как быстро такой скрипт будет работать? И нужно быть очень внимательным при проверке на ===. Если хотя бы один символ не совпадет, то выдаст результат по умолчанию

Еще раз повторюсь, если нужен город или страна, то просто меняем поля у объекта YMaps.location:

  • (YMaps.location.country): - Страна.
  • (YMaps.location.region); - Регион (область).
  • (YMaps.location.city); - Город.

В исходнике я приложил скрипт, описываемый в статье и вывел ваши координаты, для примера.

Скачать исходник

Вот такой простой скрипт для мелких нужд. Думаю, что можно ускорить процесс, если хранить название городов или регионов в массиве и делать выборку из него. Но сейчас старался делать так, чтоб было понятней. А как у вас реализован геотаргетинг. Поделитесь своими секретами и фишками. Спасибо. Пока!

Понравилась статья? Не хотите пропустить следующие материалы о самостоятельном создании и раскрутке landing page?

Подпиcывайтесь на обновления!

Комментарии: 22

  1. Михаил

    Было бы интересннее, чтобы на лендинге отображалось название города, из которого заходит посетитель. Например, заходит человек из Нижнего Новгорода, и видит «Черенок для лопат с доставкой в Нижний Новгород».

    • dimadv7

      Так в статье об этом и написано. Мы получили страну, город и регион. А что выводить — дело хозяйское, я показал на примере региона.

      Аналогичным образом можно, например, подменять Адрес доставки или ваши Дескрипторы, ориентированные на город или регион пользователя:

      • Бесплатная доставка по Москве и Московской области (Донецку и Донецкой области) и так далее.
  2. Михаил

    А еще про мультилендинг было бы интересно.

    • dimadv7

      Да знаю, работаю над этим 🙂 Думаю, скоро появится 🙂 Чтобы ускорить написание статьи на определенную тематику, был создан этот раздел, в котором можно предложить тему для статьи.

  3. Николай

    Всё отлично Вы расписали, сам сейчас занимаюсь сайтостроением и частенько к Вам заглядую, за инфу большое спасибо. Но вот вопрос по геотаргетингу — как проверить на своём компьютере работает ли (то есть зайти «с украины» «с России») ?

    • dimadv7

      Здравствуйте. Можно попросить друзей, знакомых с другого города (страны). Или можно попробовать через прокси другой страны.

  4. Михаил

    Достаточно поменять в Яндексе расположение.

  5. Артём

    Видел такую фичу на лендингах, как автоматические определение, конкретного адреса посетителя, когда он кликает на строку «адрес» ( сторка в лид форме). Что это такое ? Выдаёт адрес с точностью до квартиры.

    • dimadv7

      Где ты такое видел? Не думаю, что это возможно, если ты сам сервису не оставлял уже когда-то адрес.

  6. Артём

    glow-pro.ru
    вот здесь

    • dimadv7

      У меня ничего автоматически не подставляется в адрес… У тебя, наверное, просто вылезла подсказка. Ты в подобное поле где-то вводил свой адрес, вот браузер и запомнил. Такая же ситуация бывает и с e-mail адресами, логинами, реквизитами. Но сайт не имеет никакого отношения к этому. По умолчанию во всех инпутах это включено.

  7. Андрей

    Всё утро тыкаюсь, но так пока не додумал.
    Такая ситуация :
    На лп есть много форм заявок,каждая работает со своим обработчиком . Данные передаются POST . Но хотелось бы, что-бы вместе с вводимыми данными передавались и поля геотаргетинга ( страна,регион,город).
    Прикрутить к самому лп(скрывая css). — не вариант,конфликтуют библиотеки jquery .
    Но при отправки сообщения,на время с рефрешем открывается страница с обработчиком, вот на ней как раз работает скрипт,но как передать данные с неё в письмо?
    сохранение переменной — $username = $_POST['name'];
    передача переменой $msg .= «От кого: «.$username.»\r\n»;

    • dimadv7

      Так а зачем тебе 2 библиотеки jQuery — оставь одну… Не понимаю в чем проблема? Не понимаю, что значит «Прикрутить к самому лп (скрывая css)»

  8. Андрей

    Если упростить вопрос: как передать эти данные методом пост?
    Может был подобный опыт

    • dimadv7

      Ну смотри, в статье описано как сохранить в переменной и вывести в нужном месте. Вот и попробуй передать эти данные в параметр value в поле с type=»hidden». А уже в обработчике их по аналогии с обычными полями отправлять. Или сохранить эти данные в сессию и так же в обработчике отправить, как и обычные данные полученные из полей.

    • Андрей

      Это как раз всё понятно=)
      Но не как не дойдёт,в какой форме записать и передать значение Ваш регион (область): в value ?

    • dimadv7

      А как вы уже пробовали?
      Что не получается?
      Например есть поле

      <input id="reg" value="">

      в скрипте сохраняем в переменную и заполняем value

      var youRegion == (YMaps.location.region); 
      $('#reg').val(youRegion);
      

      А после, ловим значение в обработчике, как и во всех остальных полях.

  9. Виталий

    Доброго дня!
    Хучу подменять номер телефона только для Москвы и Московской области для всех остальных по умолчанию. Вроде Ваш вариант хорошо и подходит для этих целей, но у меня всегда показывает что я из Москвы и области, хотя это не так, проверял через сторонние ресурсы.
    Помогите разобраться.

    • dimadv7

      Да я вряд ли смогу помочь, ведь это яндекс так вас определяет. Подобных проблем не замечал, и никто не сообщал, о том, что не корректно определяет регион.

  10. Добрый день

    Пытаюсь вынести скрипт изменения номера телефона в зависимости от региона в отдельный файл — не работает. В документе работает, через подключенный файл не хочет. Может подскажите, как изладить?

  11. Макс

    Подскажите как присвоить значение переменной в PHP то что отдает нам Яндекс YMaps.location.city. То есть допустим у меня определился город он находится в переменной YMaps.location.city в javascript, как можно это значение подставить в переменную php чтобы дальше работать с БД?

    • Евгений

      Используйте Ajax

Добавить комментарий