Александр Крылов
Счастье, SEO, Череповец, Яндекс Директ, ВКонтакте, SMM

Обратный звонок

/ Просмотров: 19779

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

Что такое обратный звонок? Это широко распространённый способ стимулирования клиента к установлению контакта. Человек на сайте видит кнопку "заказать звонок", а нажав на неё - открывается окошко, в котором он может оставить свой телефон и имя, и ожидать звонка.

Кнопка выглядит примерно так:

А форма - так:

Код для её реализации очень простой.

Будет два файла. Первый - содержит форму заказа обратного звонка.

Второй - отправляет полученные данные на вашу почту.

Просто скопируйте код первого файла в отдельный текстовый файл и сохраните его как call.html, а код второго - также в отдельный текстовый файл - и его нужно будет сохранять как call.php.

Итак. Код первого:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Заказ обратного звонка</title>
</head>
<body>
Заказать бесплатный звонок. Мы вам перезвоним и отдадим скидку. 
<form action="call.php" method="post">
Как вас зовут?
  <input type="text" name="name" />
Ваш номер телефона
<input type="text" name="phone" />
<input type="submit" value="Отправить данные для звонка!">
</form>
</body>
</html>

Этот текст нужно сохранить в файл call.html.

Второй файл должен называться call.php

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Обработка заявки на звонок</title>
</head>
<body>
<?php
/*Создаём функцию для отправки письма*/
function send_email($name_from, // имя отправителя
                        $email_from, // email отправителя
                        $name_to, // имя получателя
                        $email_to, // email получателя
                        $data_charset, // кодировка переданных данных
                        $send_charset, // кодировка письма
                        $subject, // тема письма
                        $body, // текст письма
                        $html = FALSE, // письмо в виде html или обычного текста
                        $reply_to = FALSE
                        ) {
  $to = mime_header_encode($name_to, $data_charset, $send_charset)
                 . ' <' . $email_to . '>';
  $subject = mime_header_encode($subject, $data_charset, $send_charset);
  $from =  mime_header_encode($name_from, $data_charset, $send_charset)
                     .' <' . $email_from . '>';
  if($data_charset != $send_charset) {
    $body = iconv($data_charset, $send_charset, $body);
  }
  $headers = "From: $from
";
  $type = ($html) ? 'html' : 'plain';
  $headers .= "Content-type: text/$type; charset=$send_charset
";
  $headers .= "Mime-Version: 1.0
";
  if ($reply_to) {
      $headers .= "Reply-To: $reply_to";
  }
  return mail($to, $subject, $body, $headers);
}
function mime_header_encode($str, $data_charset, $send_charset) {
  if($data_charset != $send_charset) {
    $str = iconv($data_charset, $send_charset, $str);
  }
  return '=?' . $send_charset . '?B?' . base64_encode($str) . '?=';
}
/* Осуществляем проверку вводимых данных и их защиту от враждебных 
скриптов */
$name = htmlspecialchars($_POST["name"]);
$phone = htmlspecialchars($_POST["phone"]);
/*На какую почту отправить уведомление?*/
$myemail = "mail@site.ru";
/*Создаём сообщение для отправки*/
$message_to_myemail = "Заявка на обратный звонок 
Отправитель: $name, телефон: $phone";
/*Отправляем письмо с помощью функции*/
send_email('Автор письма',
               'sender@site.ru',
               'Получатель письма',
               $myemail,
               'utf-8',  // кодировка, в которой находятся передаваемые строки
               'utf-8', // кодировка, в которой будет отправлено письмо
               'Письмо-уведомление',
               $message_to_myemail);
echo "Ваша заявка получена";
echo"Чтобы вернуться на главную страницу, нажмите сюда: <a href='http://aleksandr-krylov.ru/index.html'>главная страница</a>";
?>
</body>
</html>

Оба этих файла размещаем в одной папке на сервере. А кнопку "заказать обратный звонок" можно взять из предыдущей записи. Она просто должна открывать первый файл.

А второй файл содержит много дополнительного кода, и его можно было сделать куда проще, но оставил так - вдруг у вас будет другая форма, в которой будет нужно вводить ещё и электронную форму, и сообщение - кто ж знает, что вы там для клиентов удумаете )

Симпатичную кнопку, к которой можно привязать эти файлы, можно взять из предыдущей записи: Кнопка.

Комментариев: 55 RSS

Вот тоже хорошая бесплатная форма обратного звонка http://consultant-web.ru/callme/

А как сделать, чтобы кнопка открывала первый файл?

Иван, спасибо. Ссылка полезна

Роман, что значит "открывала первый файл"?

Добрый день. Вроде все установлено, но не приходят письма.

Dinak, Мария, в случае, если форма не работает, попробуйте установить набор разработчика dnwr на компьютер, а в него загрузите обе страницы: одну с формой, другую с обработчиком. В этой среде (так же называется "денвер") отправляемые письма сохраняются во внутреннюю папочку.

Так вот. Если там письма будут уходить, значит, проблема в хостинге, и решать надо с хостером.

Здравствуйте! Спасибо большое за форму, уже работаю с ней на своём сайте. Письма приходят на почту (хотя сначала отображались квадратами или вопросами), но столкнулась с проблемой. Что бы не писала в своей форме, приходит только вот это "Заявка на обратный звонок Отправитель: , телефон:", то есть самое важное - данные, которые оставляют пользователи теряются. Подскажите, пожалуйста, как исправить эту проблему?

Анна, вам нужно также поставить набор разработчика денвер. И посмотреть, в каком виде там отправляются письма

Если в заявке на обратный звонок нет данных, значит, по какой-то причине переменные имя и телефон не были переданы в файл-обработчик с помощью метода POST.

Можно попробовать поинтересоваться у техподдержки, нет ли каких-то ограничений на передачу переменных

Не получается связать кнопку с файлом call.html. Как это сделать? Подскажите, пожалуйста.

Подскажите если уже есть на сайте форма как сделать что бы кнопка вызывала форму? И ПОтом пользователь вносил туда данные. http://consultant-web.ru/callme/ вот этот набор поставил на сайт.

Егор, вам нужен просто всплывающий div-контейнер на сайте. Для кнопки делаете ссылку на этот div. Пользователь нажимает на кнопку-ссылку, открывает этот контейнер. Для него это выглядит как "всплывание"...

Алексей13
2014-08-25 в 18:22:26

Спасибо огромное я искал что то подобное целый МЕСЯЦ. Я НАКОНЕЦ ТО НАШЁЛ !!!!! СПАСИБО АВТОРУ, ОН САМЫЙ ЛУЧШИЙ !!!!!

Установил, заработала с кракозябрами. Подправил кодировку - все пашет, НО приходят два письма: в первом все данные, во втором без данных. Как убрать второе приходящее письмо ?

Писал, но почему-то коммент не сохранился... Вопрос в следующем: все работает, но приходит 2 письма. В первом все данные есть, а во втором - с пустыми данными. Как отключить вторую копию письма?

Добрый день. Я так понимаю, что с Вашей формой и просто письма можно получать. А как проверить валидность набранного в полях? И хочется чтобы письма приходили в красивой форме(видимо как то это связано с $html. Но каким образом?

Спасибо

Евгений, доброго времени суток. Попробуйте проверить работу скрипта на другом сервере. По идее косяков с дублированием писем быть не должно. Может, это особенность настройки текущего сервера?

Андрей, доброго времени )) Валидность в полях можно проверить с помощью регулярных выражений и условия if()

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

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

Пробовал и на другом сервере и на локалке - все равно письма дублируются... Возможно как-то влияет на это ДЛЕ, к оторой прикрутил этот скрипт ..

Евгений, честно говоря, не могу сказать, почему. Сделайте просто голый html-вариант - и проверьте.) На поддомене либо с использованием ненужного домена...

Алексей21
2015-03-03 в 07:10:14

Подскажите, пытаюсь поставить форму. Не понимаю. Я загрузил оба файла. Как вызвать эту форму на сайте? Какой именно файл нужно вызывать, в инструкции вы пишите что первый, в комментарии что второй. Напишите пожалуйста пример кода вызова на сайте. Спасибо.

Алексей, добрый день.

Первый файл - это файл с самой формой.

Его можно сделать отдельно или встроить в существующую страницу.

Обычно удобней встроить.

Для этого открываете исходный код страницы, в которой вам нужна форма, и в нужное место страницы между тегами вставляете код первого файла. В первом файле он также расположен между этими же тегами.

Ну а код второго файла вставляете в текстовый файл и называете его call.php

Этот файл помещаете в одну папку с той страницей, в которой форма.

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

Вот как-то так.

У меня есть на сайте http://xn--80aknjg4g.name/ кнопки, но они не работают. Формы устроены так, что поля для имени и телефона сразу открыты. Сами контейнеры я в indexhtml нашел. Но как привязать их к моему емайлу не имею представления. Нет кода с емайлами вообще ни какими. Не знаю html, поэтому прошу помощи. Думал удалить старые формы и сделать как вы пишите, но у меня нет файла call.php. Подскажите пожалуйста, как лучше сделать?

Если по-простому, то, что у вас сейчас есть - это файл с формой. И нужен ещё обработчик, то есть файл, с использованием которого будет обработано нажатие на кнопку "отправить"

То есть из представленного выше примера есть верхний файл, но нет нижнего. Его вам и нужно создать.

Альберт25
2015-07-08 в 17:23:18

Кстати, кто думает потестить - есть хороший лайфхак для Коллбэкхантера (callbackhunter). Можно получить 11 бесплатных безлимитных разговоров на месяц вместо 5 на бесплатном тарифе КИТТИ, и очень просто)) Регистрироваться нужно через лендинг для Беларуси http://callbackhunter.com/belarus - тут спецпредложение. Или еще вариант - ввести промокод belarus при регистрации и будет вам счастье. Пользуйтесь.

Здравствуйте,

Вот есть такой вариант, может кому пригодится (Всплывающее окно обратного звонка на html + php + css, без использования jQuery и Mootools) http://webgroupco.com/developers/145-vsplyvayushhee-okno-obratnogo-zvonka-na-html-php-css-bez-ispolzovaniya-jquery-i-mootools

Я уже сделал готовое решение для обратного звонка в виде бесплатного сервиса goodbeep.com Можно настроить цвет, текст, размер, есть всплытие окна при попытке закрыть сайт.

Не знаю, по мне надежнее будет заплатить, но знать что все работает как надо. Это я после пробной версии Pozvonim.com решил на таком варианте остановится )

добрый день, скажите могу ли я разместить сервис обратного звонка по заданным вами кодам на сайте созданном на бесплатной платформе WIX.com? Дело в том ,что на сайте есть возможность вставить html-код при редактировании но только в спец. отведенное окно.

и не совсем понятно,оба файла вставлять в это окно одновременно или как????

Денис, эти два файла вставляются в разные места. Они всё-таки разные роли выполняют. Лучше всего - написать в техподдержку викса. Потому что здесь ведь не просто html, a php (второй файл). А есть ли на виксе поддержка php - я не знаю.

Здравствуйте.

Правильно ли я понимаю, что отредактировать нужно две строчки:

/*На какую почту отправить уведомление?*/

$myemail = "mail@site.ru";

echo"Чтобы вернуться на главную страницу, нажмите сюда: главная страница";

Почему-то приходят письма следующего содержания:

?????? ?? ???????? ?????? ???????????: ???????, ???????: 123 123

Здравствуйте, Аноним )

Ну, в принципе, чтобы всё работало, достаточно отредактировать только целевую почту.

Роман, добрый день.

Если у вас приходят подобные сообщения, где-то есть косяк с кодировкой. Попробуйте в notepad++ сменить кодировку для файла на другие варианты - с utf-8 на windows-1251, например.

Думаю, что косяк прячется именно в кодировке файла. Вполне возможно, что он у вас уже в кодировке 1251, в то время как должен быть в utf-8.

Если же не в этом, тогда в настройках сервера проблема - и тоже с кодировкой. Но тут уже надо в техподдержку хостинга обращаться.

Везде должно быть utf-8.

AldeX спасибо за простое и эффективное решение!

Возникла проблема как и у Романа вида ???????, ???????: 123 123

Решил так: сайт у меня на dle и использует кодировку cp-1251 поэтому

в файле call.php

'utf-8' // кодировка, в которой...

'utf-8' // кодировка, в которой...

Заменяем на

'windows-1251' // кодировка, в которой...

'windows-1251' // кодировка, в которой...

Так же сам файл call.php должен быть в кодировке windows-1251

Еще мне понадобилось добавлять строчку AddDefaultCharset WINDOWS-1251 в файл .htaccess потому что иначе пользователь видел вместо сообщения "вернуться на главную..." кракозябры

Все удачи!

Алекс, спасибо вам за ваш комментарий и полезный опыт! )

Александр37
2016-02-19 в 17:59:02

Сменить кодировку для файлов на другой вариант - с utf-8 на windows-1251 помогло. Бракозяблы исчезли. Возникла проблема с полем ввода имени. Корректно приходят уведомления на почту только имена на англ. яз. На русском - пустота.

Англ - (Заявка на обратный звонок Отправитель: Rfgcfgh, телефон: 333333)

Рус - (Заявка на обратный звонок Отправитель: , телефон: 333333)

Помогите пожалуйста решить проблему. Спасибо.

Александр, добрый день. Лично я бы сделал следующим образом: нашёл любой бесплатный хостинг (можно также Денвер установить), на нём бы поставил форму обратного звонка и посмотрел, есть ли подобный глюк или нет.

Если нет, то потом просто проверить, в чём разница в настройках. И всё )

Дмитрий39
2016-03-21 в 16:42:24

Все наладил, все всплывает и отправляет. Единственное, вместо "Чтобы вернуться на главную страницу, нажмите сюда:" и далее символы. Подскажите как исправить. И как сделать что бы автоматом на главную улетало.

Дмитрий40
2016-03-21 в 17:40:49

Пришлось подправить файл htaccess. Остался последний вопрос. Хочется что бы сама закрывалась. А так все классно, настроил всплывающее окно через плагин. В окно запихнул модернизированную форму, которая вызывает ваш php.

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

Здравствуйте!! Отличная форма обратного звонка. У меня на сайте все работет. Каз делать проверку на заполнения полей? письма отправляются даже когда поля не заполняются

Здравствуйте ) Лично я таких проверок делать не стал, поскольку пустые письма мне не мешают.

Александр12346
2016-08-11 в 08:45:21

Как вставить в страницу эту кнопку, помогите пжлст чайнику... (

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

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

Саша, доброго дня. Решил воспользоваться только

вторым php файлом, т.к. блан и форма у меня уже были.

http://akrilat.ru/ В первом файле добавил только acti, чтобы

ссылался на php файл. Отредактировал ящик. По

интерфейсу вижу, что все работает, но письма не

приходят. Хостинг на 1Gb. Обратился в поддержку, на

что получил ответ, что " при отправке скрипты

должны формировать заголовок from и в него

указывать ящик, существующий в личном кабинете."

Вот только не знаю, где указать этот ящик в php

скрипте. К сожалению в программировании я почти 0.

Подскажете?

Возможно это поможет ответить на вопрос http://www.1gb.ru/hosting_email.php

Добрый день, Вадим.

Я думаю, вы уже определились, что адрес куда отправлять - это вот эта строка:

$myemail = "mail@site.ru";

Ящик, существующий в кабинете, можно попробовать подставить вот сюда:

'sender@site.ru',

Поскольку потом этот ящик будет использован в заголовке from, который создан в функции вот тут:

$from = mime_header_encode($name_from, $data_charset, $send_charset)

.' ';

Строка $from в комментарий целиком не поместилась, поскольку движок сайта режет комментарии для защиты от возможных атак. Выше в примере - там две строчки )

Отмечу также, что, насколько помню, у данного хостинга есть какие-то ограничения по работе с php. Поэтому если решить задачу этим способом не получится, то надо будет подумать )

Дмитрий52
2016-09-29 в 15:10:57

Здравствуйте, помогите соеденить 2 тих файла в один! У меня в CMS данные отправляются только если все в одном.

Дмитрий, здравствуйте.

Чтобы объединить два файла в один, нужно сделать следующее:

1) Создать один файл call.php

2) Перенести в него содержимое обоих файлов

3) В начале файла создать условие "если"

Если существуют глобальные переменные name, phone, то выполнить вторую часть файла (отправить письмо).

Если не существуют - то показать форму для отправки.

То есть код будет начинаться с фразы if isset - а дальше два варианта.

Подробней мне сложно пояснить, поскольку это требует некоторых мелких деталей, а я не знаю, насколько хорошо вы в этом ориентируетесь.

Но если что-то осталось непонятным, то я очень рекомендую вам посмотреть курс по PHP и MySQL Евгения Попова - там, в том числе, рассмотрен пример именно такого варианта 2 файла в одном.

Ребят, для нежелающих разбираться с кодом, коих тут, вероятне всего, довольно мало предлагаю попробовать воспользоваться уже готовым решением от сервиса https://excitel.net/

После регистрации будет доступен код кнопки, который нужно будет добавить на свой сайт.

Есть возможность настроить кнопку под свои предпочтения (как дизайн, так и функционал).

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

Спасибо за ваш комментарий. Посмотрел сервис - вроде, по делу. Наличие бесплатной версии радует.

Правда, на мой взгляд, вам бы стоило подробней расписать, как там реализовать заказ обратного звонка.

Поскольку сейчас это на сайте вообще не видно.

Оставьте комментарий!

Комментарий будет опубликован после проверки

Имя и сайт используются только при регистрации

Авторизация MaxSiteAuth.

(обязательно)