В этой записи мы рассмотрим, как сделать простейшую форму для заказа обратного звонка.
Что такое обратный звонок? Это широко распространённый способ стимулирования клиента к установлению контакта. Человек на сайте видит кнопку «заказать звонок», а нажав на неё — открывается окошко, в котором он может оставить свой телефон и имя, и ожидать звонка.
Кнопка выглядит примерно так:
А форма — так:
Код для её реализации очень простой.
Будет два файла. Первый — содержит форму заказа обратного звонка.
Второй — отправляет полученные данные на вашу почту.
Просто скопируйте код первого файла в отдельный текстовый файл и сохраните его как 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='https://aleksandr-krylov.ru/index.html'>главная страница</a>";
?>
</body>
</html>
Оба этих файла размещаем в одной папке на сервере. А кнопку «заказать обратный звонок» можно взять из предыдущей записи. Она просто должна открывать первый файл.
А второй файл содержит много дополнительного кода, и его можно было сделать куда проще, но оставил так — вдруг у вас будет другая форма, в которой будет нужно вводить ещё и электронную форму, и сообщение — кто ж знает, что вы там для клиентов удумаете )
Симпатичную кнопку, к которой можно привязать эти файлы, можно взять из предыдущей записи: Кнопка.
Ребят, для нежелающих разбираться с кодом, коих тут, вероятне всего, довольно мало предлагаю попробовать воспользоваться уже готовым решением от сервиса https://excitel.net/
После регистрации будет доступен код кнопки, который нужно будет добавить на свой сайт.
Есть возможность настроить кнопку под свои предпочтения (как дизайн, так и функционал).
Можно по нажатию на кнопку просто принимать звонки через интернет, можно принимать голосовые сообщения либо заказы на обратный звонок.
Спасибо за ваш комментарий. Посмотрел сервис — вроде, по делу. Наличие бесплатной версии радует.
Правда, на мой взгляд, вам бы стоило подробней расписать, как там реализовать заказ обратного звонка.
Поскольку сейчас это на сайте вообще не видно.
Здравствуйте, помогите соеденить 2 тих файла в один! У меня в CMS данные отправляются только если все в одном.
Дмитрий, здравствуйте.
Чтобы объединить два файла в один, нужно сделать следующее:
1) Создать один файл call.php
2) Перенести в него содержимое обоих файлов
3) В начале файла создать условие «если»
Если существуют глобальные переменные name, phone, то выполнить вторую часть файла (отправить письмо).
Если не существуют — то показать форму для отправки.
То есть код будет начинаться с фразы if isset — а дальше два варианта.
Подробней мне сложно пояснить, поскольку это требует некоторых мелких деталей, а я не знаю, насколько хорошо вы в этом ориентируетесь.
Но если что-то осталось непонятным, то я очень рекомендую вам посмотреть курс по PHP и MySQL Евгения Попова — там, в том числе, рассмотрен пример именно такого варианта 2 файла в одном.
Возможно это поможет ответить на вопрос 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. Поэтому если решить задачу этим способом не получится, то надо будет подумать )
Саша, доброго дня. Решил воспользоваться только
вторым php файлом, т.к. блан и форма у меня уже были.
http://akrilat.ru/ В первом файле добавил только acti, чтобы
ссылался на php файл. Отредактировал ящик. По
интерфейсу вижу, что все работает, но письма не
приходят. Хостинг на 1Gb. Обратился в поддержку, на
что получил ответ, что » при отправке скрипты
должны формировать заголовок from и в него
указывать ящик, существующий в личном кабинете.»
Вот только не знаю, где указать этот ящик в php
скрипте. К сожалению в программировании я почти 0.
Подскажете?
Как вставить в страницу эту кнопку, помогите пжлст чайнику… (
Здравствуйте, Александр.
Вам нужно создать два файла и поместить их на сервер. И посмотреть, работает ли. Потому что для работы формы обратного звонка должен использоваться сервер с поддержкой PHP
Все супер! Спасибо!
Да всегда пожалуйста )
Здравствуйте!! Отличная форма обратного звонка. У меня на сайте все работет. Каз делать проверку на заполнения полей? письма отправляются даже когда поля не заполняются
Здравствуйте ) Лично я таких проверок делать не стал, поскольку пустые письма мне не мешают.
Пришлось подправить файл htaccess. Остался последний вопрос. Хочется что бы сама закрывалась. А так все классно, настроил всплывающее окно через плагин. В окно запихнул модернизированную форму, которая вызывает ваш php.
Дмитрий, добрый вечер. Единственная мысль, которая приходит в голову по автозакрытию — это найти подобный функционал на чьём-то сайте и посмотреть реализацию. Больше идей нет )
Все наладил, все всплывает и отправляет. Единственное, вместо «Чтобы вернуться на главную страницу, нажмите сюда:» и далее символы. Подскажите как исправить. И как сделать что бы автоматом на главную улетало.
Сменить кодировку для файлов на другой вариант — с utf-8 на windows-1251 помогло. Бракозяблы исчезли. Возникла проблема с полем ввода имени. Корректно приходят уведомления на почту только имена на англ. яз. На русском — пустота.
Англ — (Заявка на обратный звонок Отправитель: Rfgcfgh, телефон: 333333)
Рус — (Заявка на обратный звонок Отправитель: , телефон: 333333)
Помогите пожалуйста решить проблему. Спасибо.
Александр, добрый день. Лично я бы сделал следующим образом: нашёл любой бесплатный хостинг (можно также Денвер установить), на нём бы поставил форму обратного звонка и посмотрел, есть ли подобный глюк или нет.
Если нет, то потом просто проверить, в чём разница в настройках. И всё )
AldeX спасибо за простое и эффективное решение!
Возникла проблема как и у Романа вида ???????, ???????: 123 123
Решил так: сайт у меня на dle и использует кодировку cp-1251 поэтому
в файле call.php
‘utf-8’ // кодировка, в которой…
‘utf-8’ // кодировка, в которой…
Заменяем на
‘windows-1251’ // кодировка, в которой…
‘windows-1251’ // кодировка, в которой…
Так же сам файл call.php должен быть в кодировке windows-1251
Еще мне понадобилось добавлять строчку AddDefaultCharset WINDOWS-1251 в файл .htaccess потому что иначе пользователь видел вместо сообщения «вернуться на главную…» кракозябры
Все удачи!
Алекс, спасибо вам за ваш комментарий и полезный опыт! )
Почему-то приходят письма следующего содержания:
?????? ?? ???????? ?????? ???????????: ???????, ???????: 123 123
Роман, добрый день.
Если у вас приходят подобные сообщения, где-то есть косяк с кодировкой. Попробуйте в notepad++ сменить кодировку для файла на другие варианты — с utf-8 на windows-1251, например.
Думаю, что косяк прячется именно в кодировке файла. Вполне возможно, что он у вас уже в кодировке 1251, в то время как должен быть в utf-8.
Если же не в этом, тогда в настройках сервера проблема — и тоже с кодировкой. Но тут уже надо в техподдержку хостинга обращаться.
Везде должно быть utf-8.
Здравствуйте.
Правильно ли я понимаю, что отредактировать нужно две строчки:
/*На какую почту отправить уведомление?*/
$myemail = «mail@site.ru»;
echo»Чтобы вернуться на главную страницу, нажмите сюда: главная страница»;
Здравствуйте, Аноним )
Ну, в принципе, чтобы всё работало, достаточно отредактировать только целевую почту.
и не совсем понятно,оба файла вставлять в это окно одновременно или как????
Денис, эти два файла вставляются в разные места. Они всё-таки разные роли выполняют. Лучше всего — написать в техподдержку викса. Потому что здесь ведь не просто html, a php (второй файл). А есть ли на виксе поддержка php — я не знаю.
добрый день, скажите могу ли я разместить сервис обратного звонка по заданным вами кодам на сайте созданном на бесплатной платформе WIX.com? Дело в том ,что на сайте есть возможность вставить html-код при редактировании но только в спец. отведенное окно.
Не знаю, по мне надежнее будет заплатить, но знать что все работает как надо. Это я после пробной версии Pozvonim.com решил на таком варианте остановится )
Я уже сделал готовое решение для обратного звонка в виде бесплатного сервиса goodbeep.com Можно настроить цвет, текст, размер, есть всплытие окна при попытке закрыть сайт.
Здравствуйте,
Вот есть такой вариант, может кому пригодится (Всплывающее окно обратного звонка на html + php + css, без использования jQuery и Mootools) http://webgroupco.com/developers/145-vsplyvayushhee-okno-obratnogo-zvonka-na-html-php-css-bez-ispolzovaniya-jquery-i-mootools
Кстати, кто думает потестить — есть хороший лайфхак для Коллбэкхантера (callbackhunter). Можно получить 11 бесплатных безлимитных разговоров на месяц вместо 5 на бесплатном тарифе КИТТИ, и очень просто)) Регистрироваться нужно через лендинг для Беларуси http://callbackhunter.com/belarus — тут спецпредложение. Или еще вариант — ввести промокод belarus при регистрации и будет вам счастье. Пользуйтесь.
У меня есть на сайте http://xn--80aknjg4g.name/ кнопки, но они не работают. Формы устроены так, что поля для имени и телефона сразу открыты. Сами контейнеры я в indexhtml нашел. Но как привязать их к моему емайлу не имею представления. Нет кода с емайлами вообще ни какими. Не знаю html, поэтому прошу помощи. Думал удалить старые формы и сделать как вы пишите, но у меня нет файла call.php. Подскажите пожалуйста, как лучше сделать?
Если по-простому, то, что у вас сейчас есть — это файл с формой. И нужен ещё обработчик, то есть файл, с использованием которого будет обработано нажатие на кнопку «отправить»
То есть из представленного выше примера есть верхний файл, но нет нижнего. Его вам и нужно создать.
Подскажите, пытаюсь поставить форму. Не понимаю. Я загрузил оба файла. Как вызвать эту форму на сайте? Какой именно файл нужно вызывать, в инструкции вы пишите что первый, в комментарии что второй. Напишите пожалуйста пример кода вызова на сайте. Спасибо.
Алексей, добрый день.
Первый файл — это файл с самой формой.
Его можно сделать отдельно или встроить в существующую страницу.
Обычно удобней встроить.
Для этого открываете исходный код страницы, в которой вам нужна форма, и в нужное место страницы между тегами вставляете код первого файла. В первом файле он также расположен между этими же тегами.
Ну а код второго файла вставляете в текстовый файл и называете его call.php
Этот файл помещаете в одну папку с той страницей, в которой форма.
Теперь, когда в первой странице вы нажмёте на кнопку отправки данных, произойдёт обращение ко второй странице, которая отправит данные для звонка к вам на почту.
Вот как-то так.
Пробовал и на другом сервере и на локалке — все равно письма дублируются… Возможно как-то влияет на это ДЛЕ, к оторой прикрутил этот скрипт ..
Евгений, честно говоря, не могу сказать, почему. Сделайте просто голый html-вариант — и проверьте.) На поддомене либо с использованием ненужного домена…
Добрый день. Я так понимаю, что с Вашей формой и просто письма можно получать. А как проверить валидность набранного в полях? И хочется чтобы письма приходили в красивой форме(видимо как то это связано с $html. Но каким образом?
Спасибо
Андрей, доброго времени )) Валидность в полях можно проверить с помощью регулярных выражений и условия if()
Но опыт показал, что клиенты — это такие люди, которые могут ввести в поле, где телефон, например, электронную почту. Если его заставить перепечатывать — он может и не оставить заявку.
Поэтому я бы с проверкой ввода заморачивался только в случае, если заявок с ошибками много. Это тот случай, на мой взгляд, когда улучшив форму, можно снизить количество заявок.
Писал, но почему-то коммент не сохранился… Вопрос в следующем: все работает, но приходит 2 письма. В первом все данные есть, а во втором — с пустыми данными. Как отключить вторую копию письма?
Установил, заработала с кракозябрами. Подправил кодировку — все пашет, НО приходят два письма: в первом все данные, во втором без данных. Как убрать второе приходящее письмо ?
Евгений, доброго времени суток. Попробуйте проверить работу скрипта на другом сервере. По идее косяков с дублированием писем быть не должно. Может, это особенность настройки текущего сервера?
Спасибо огромное я искал что то подобное целый МЕСЯЦ. Я НАКОНЕЦ ТО НАШЁЛ !!!!! СПАСИБО АВТОРУ, ОН САМЫЙ ЛУЧШИЙ !!!!!
Алексей, спасибо на добром слове )
Подскажите если уже есть на сайте форма как сделать что бы кнопка вызывала форму? И ПОтом пользователь вносил туда данные. http://consultant-web.ru/callme/ вот этот набор поставил на сайт.
Егор, вам нужен просто всплывающий div-контейнер на сайте. Для кнопки делаете ссылку на этот div. Пользователь нажимает на кнопку-ссылку, открывает этот контейнер. Для него это выглядит как «всплывание»…
Не получается связать кнопку с файлом call.html. Как это сделать? Подскажите, пожалуйста.
Кнопку надо связывать с файлом call.php. )
Здравствуйте! Спасибо большое за форму, уже работаю с ней на своём сайте. Письма приходят на почту (хотя сначала отображались квадратами или вопросами), но столкнулась с проблемой. Что бы не писала в своей форме, приходит только вот это «Заявка на обратный звонок Отправитель: , телефон:», то есть самое важное — данные, которые оставляют пользователи теряются. Подскажите, пожалуйста, как исправить эту проблему?
Анна, вам нужно также поставить набор разработчика денвер. И посмотреть, в каком виде там отправляются письма
Если в заявке на обратный звонок нет данных, значит, по какой-то причине переменные имя и телефон не были переданы в файл-обработчик с помощью метода POST.
Можно попробовать поинтересоваться у техподдержки, нет ли каких-то ограничений на передачу переменных
Добрый день. Вроде все установлено, но не приходят письма.
Мария, в случае, если форма не работает, попробуйте установить набор разработчика dnwr на компьютер, а в него загрузите обе страницы: одну с формой, другую с обработчиком. В этой среде (так же называется «денвер») отправляемые письма сохраняются во внутреннюю папочку.
Так вот. Если там письма будут уходить, значит, проблема в хостинге, и решать надо с хостером.
Не работает форма….
Dinak, попробуйте установить набор разработчика dnwr на компьютер, а в него загрузите обе страницы: одну с формой, другую с обработчиком. В этой среде (так же называется «денвер») отправляемые письма сохраняются во внутреннюю папочку.
Так вот. Если там письма будут уходить, значит, проблема в хостинге, и решать надо с хостером.
А как сделать, чтобы кнопка открывала первый файл?
Роман, что значит «открывала первый файл»?
Вот тоже хорошая бесплатная форма обратного звонка http://consultant-web.ru/callme/
Иван, спасибо. Ссылка полезна