Денис Герасимов

Отправка формы. Скрипт. Передача utm через Referer

Заставка к видео - Отправка формы. Скрипт. Передача utm через Referer

Приветствую! С вами Денис Герасимов сайт rek9.ru и мы поговорим про Скрипт отправки формы к вам на email и об одном маленьком нюансе — передаче utm метки в письмо с помощью Referer.

Что необходимо для передачи utm меток при отправке формы?

  1. Лендинг с формой. Если у вас его до сих пор нет, то в предыдущей статье вы можете узнать о том, как с помощью bootstrap можно создать адаптивный лендинг. (Лендинг также можно скопировать)
  2. Скрипт отправки формы на email. Возможно он есть у вас в комплекте с лендингом. Если его нет, то вы можете его скачать под этой статьей.
  3. Натсроить скрипт, соединить форму лендинга с этим скриптом и настроить скрипт таким образом, чтобы письма приходили к вам на email.
  4. Для того, чтобы видеть utm метки необходимо прописать строчку на php
    <b>Заявка пришла со страницы: </b> ' . $_SERVER["HTTP_REFERER"] .'<br>.

    В итоге если заявка пришла со страницы с utm метками, то вы увидите эти метки у себя в письме.

Настройка отправки формы на email с utm метками

У меня есть лендинг, который мы создали в предыдущей статье. Я его уже закачал на сервер, у меня есть доступ к хостингу и есть скрипт отправки письма, который состоит из трех файлов (скачать вы его можете чуть выше). Обработчик главной формы это mailer.php файл. Находятся эти файлы в той же папке, что и сайт.

Сейчас покажу как связывать форму с обработчиком. Для этого перейдем на мой рабочий стол. Откроем папку, где содержится код страницы нашего созданного лендинга, откроем файл Index в NotePad++. В строке с тегом <form> необходимо ввести строчку action = «mail/mailer.php» указав тем самым путь до нашего обработчика на сервере. Необходимо так же прописать method = «post». Далее в поле, где мы передаем email необходимо прописать name = «email», а в поле, где мы передаем имя прописать name = «name», а тип кнопки изменить на <button type = «submit», чтобы при нажатии этой кнопки передавались данные к обработчику. То есть изменить нужно всего 4 строчки. Смотрите измененный код ниже. Копировать для внесения изменений на свой сайт, лучше тоже от туда.

<form role="form" action="mail/mailer.php" method="post">
<div class="form-group">
<label for="exampleInputPassword1">Введите имя</label><input type="text" name="name" class="form-control" id="exampleInputName">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Введите email</label><input type="email" name="email" class="form-control" id="exampleInputEmail1">
</div>
<button type="submit" class="btn btn-danger btn-lg btn-block">Получить доступ!</button>
</form>

Файл mailer.phpТеперь перейдем в обработчик, и его изменим. Откройте файл maler.php. В строчку subject «Заявка с сайта …» вместо многоточия вставьте адрес вашего сайта. Так же мы можем изменить поле ТЕМА, меняется оно с помощью INFO, которое передается в обработчик. Это сделать можно так: допусти у вас на сайте есть еще одна форма, и в нее вы добавляете скрытое поле с значением name=»info»  и тогда тема письма «заявка с сайта..» затрется тем, что вы передадите, например «заявка на звонок» или «заявка на покупку». Тогда уже из письма вы поймете, что хочет получить человек, который заполнил форму.

<?php
/*
* Денис Герасимов https://rek9.ru/
* Данный скрипт обрабатывает форм и отправляет ее на email
* В письме вы увидите utm метки, если использовали их в рекламной кампании
* Измените в данном скрипте:
* 1. Тему письма (13 строчку)
* 2. Введите ваш email, на который отправлять обработанную форму (36 строчка)
* 3. Email, с которого отправлять письмо (39 строчка)
* 4. Имя, с которого отправляется письмо (40 строчка)
* 5. URL, на который будет переадресация, при успешной отправке формы (45 строчка)
*/
$subject = 'Заявка с сайта ...'; // тема письма , вместо многоточия вставьте ваш домен
$mess = '';
$mess .= '<hr>';
if(isset($_POST['info'])) {
$subject = $_POST['info']; // тема письма , можно передать другое значение в поле hidden name="info"
}
if(isset($_POST['name'])) {
$name = substr(htmlspecialchars(trim($_POST['name'])), 0, 100);
$mess .= '<b>Имя отправителя: </b>' . $name . '<br>';
}
if(isset($_POST['email'])) {
if($_POST['email']!=''){
$email = substr(htmlspecialchars(trim($_POST['email'])), 0, 100);
$mess .= '<b>Email: </b>' . $email . '<br>';
}
}
$mess .= '<b>Заявка пришла со страницы:</b> ' . $_SERVER["HTTP_REFERER"] .'<br>'; // строчка, в которой передается UTM метки если есть
$mess .= '<hr>';
// подключаем файл класса для отправки почты
require 'class.phpmailer.php';
$mail = new PHPMailer();
$mail->AddAddress('test@test.ru',''); // кому - адрес, Имя (например, 'email@ rek9.ru','Денис Герасимов')
$mail->IsHTML(true); // выставляем формат письма HTML
$mail->CharSet = "UTF-8"; // кодировка
$mail->From = "root@localhost"; // email, с которого отправиться письмо
$mail->FromName = "Денис Герасимов"; // откого письмо
$mail->Body = $mess;
// отправляем наше письмо
if ($mail->Send()) header('Location: ../'); // в поле Location можно настроить переадресацию
else { die ('Mailer Error: ' . $mail->ErrorInfo); }
?>

Далее в коде файла maler.php идет обработчик name, то есть нашего имени. Если есть такое поле, то убрать все лишние пробелы и записать это в переменную name, которую мы уже подставляем в строчку «имя отправителя», то есть имя, которое заполнили в форме.

Далее идет обработчик формы email, то есть какой адрес электронной почты заполнил посетитель.

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

Далее в коде идет настройка письма. В строке с надписью Adress прописываете свой email. Далее настраивается строчка From от кого пришло письмо, здесь прописываете свой домен, в строке FromName пишите свое имя, представление вас, например, «Денис Герасимов».

Далее идет строчка if, с кодом, если письмо отправлено, то идет переадресация на какую-то страницу сайта, в строке Location… вместо многоточия поставьте страницу для перехода. В результате вы можете настроить Яндекс.Метрику таким образом, что при посещении страницы для перехода, будет засчитано отправка формы с вашего сайта.

После внесенных изменений, сохраните файл и посмотрите изменения на вашем лендинге. Попробуем заполнить форму на сайте, нажмем на кнопку ПОЛУЧИТЬ ДОСТУП и увидим, что происходит переадресация на другую страницу. А к нам на электронную почту, которую мы указали в коде maler.php, пришло письмо «Заявка с сайта». В письме прописано от кого пришло письмо, и с какого адреса. Имейте ввиду, что иногда заявки попадают в спам, поэтому нужно настроить фильтр, чтобы они попадали во Входящие.

Теперь протестируем как работают utm метки. Для этого воспользуемся конструктором utm меток www.tools.yaroshenko.by. Выберите раздел Генератор UTM меток, Ведите адрес целевой страницы (ваш домен), Источник трафика выберите для примера Яндекс.Директ. Измените НАЗВАНИЕ КАМПАНИИ, УНИКАЛЬНЫЙ ИДЕНТИФИКАТОР, КЮЧЕВОЕ СЛОВО, например, «Игры для девочек». Нажмите кнопку СГЕНЕРИРОВАТЬ ССЫЛКУ UTM МЕТКАМИ.

Письмо с utm меткамиПосле этого скопируем ссылку и вставим ее в адресную строку нашего лендинга, предполагая, что на рекламной кампании из Яндекса к нам пришли на лендинг. Затем увидим, что в адресной строке изменился код, который обозначает, что посетитель перешел на наш лендинг с рекламы на Яндексе по ключевому слову «игры для девочек». Теперь попробуем снова заполнить форму. После нажатия кнопки, проверяем свою почту. В письме увидим, что заявка пришла со страницы с длинным кодом и UTM метками. В итоге вы можете увидеть какое объявление конвертит в заявку, какое ключевое слово лучше работает. Обратите внимание, что utm term у нас закодирован. Чтобы их увидеть нужно навести курсором мыши на ссылку и в левом нижнем углу браузера, можно увидеть, что utm term = «игры для девочек». Если вы не хотите, чтобы в письме utm term   было зашифровано, то лучше в генераторе utm меток использовать в графе КЛЮЧЕВОЕ СЛОВО вместо {keyword} такой макрос как {phrase_id}. Тогда вместо ключевого слова подставиться уникальный идентификатор фраз, который вы сможете расшифровать в Директ Коммандере.

Вот такой принцип работы скрипта, который вы можете скачать по ссылке в статье.

↓ Презентация cloud.mail.ru

↓ Скрипт cloud.mail.ru

Подпишитесь на YouTube канал

  • Саша

    Как реализовать форму, с записью данных из нее в файл rtf(doc) и отправки этого файла на почту?

    • https://rek9.ru Денис Герасимов

      Как подобное реализовать не знаю,
      Может, вам вот эта статья поможет? http://rek9.ru/otpravka-zayavok-v-google-forms/ отправка данных в гугл формс и там же идет настройка оповещения на почту.

  • Андрей

    Спасибо

  • Prefer Prefer

    Денис, у меня в коде все по другому прописано

    • https://rek9.ru Денис Герасимов

      Вот такое встречается в коде на исходном сайте?

  • Антон

    Денис, у меня тоже по другому прописано…

    • https://rek9.ru Денис Герасимов

      Антон, здравствуйте
      Могу помочь, только платно. Мои услуги стоят от 3900 руб. за услугу.
      Если у вас цель сделать передачу utm меток, то вы можете поступить следующим образом:
      1. Изменить код на мой, при этом оставить нетронутыми тексты внутри основного

  • Алексей Лысункин

    Доброго дня. У меня вопрос. Как быть, если нужно отправить форму только после перехода на другую страницу по нажатии там одной кнопки? Да ещё , чтобы значение кнопки добавилось в виде текста в сообщение с формой? Либо в самой кнопке вставить php-скрипт, либо использовать перед кнопкой скрытое поле ? Форма находится на главной странице сайта, а дополнительная кнопка-на другой странице сайта. Как всё это осуществить? Я в программировании полный ноль.

    • https://rek9.ru Денис Герасимов

      Здравствуйте, Алексей.

      Я бы на вашем месте сделал следующее — нанял программиста.

      А так нужно использовать 2 формы.
      Главная форма на главной.
      Вторая форма со скрытыми полями на второй странице.
      Из главной методом post передаются необходимые данные на другую страницу, на которой все это подставляется в скрытые поля, а при нажатие на кнопку форма уже отправляется либо к вам на емайл, либо в гугл докс.

      Как вариант можно использовать специальные сервисы, например, e-autopay

      • Алексей Лысункин

        Спасибо. Теперь буду представлять, каков план действий и куда двигаться.

        • https://rek9.ru Денис Герасимов

          Ссылочку я подтер.

          Можно и его использовать. Все зависит от вашей задачи.

  • http://vk.com/id7244531 Иван Незговоров

    Не работает у меня этот скрипт, что бы я не делал(( Пробовал на двух разных хостингах и на локальном сервере Denver, скрипт выполняется, переадресация срабатывает, а письмо не приходит(( Denver отлавливает письма в отладочную заглушку sendmail с текстом в кривой кодировке и всё(( Помогите пожалуйста разобраться, может я что-то не так делаю? Ниже прикрепил скрин настроек mailer.php и скрин куска кода из index.html

    • https://rek9.ru Денис Герасимов

      Иван,
      Странно, все корректно работает

      • http://vk.com/id7244531 Иван Незговоров

        Разобрался, заработало)

        • https://rek9.ru Денис Герасимов

          Иван, в чем была причина? Поделитесь

  • http://vk.com/titovaleksey63 Алексей Титов

    Денис подскажите а если обработчик идет от смартреспондера или джастклика как в этом случае настроить чтобы метки по подписчикам приходили на почту?

    • https://rek9.ru Денис Герасимов

      Алексей, вам на почту, чтобы приходили?

      Если пользуетесь конструктором страниц приземления, то эта функция настроена обычно в конструкторах по умолчанию.

      Если у вас собственный лендинг, то лучше нанять программиста.