Привет друзья! Наконец-то, после десятка писем на почту с просьбой поделиться скриптом, решил рассказать вам про свой универсальный скрипт формы обратной связи, который работает на AJAX, имеет встроенную проверку полей формы на валидность и подойдет для любого сайта на любом движке, или даже на чистом html.
Сразу стоит сказать, что это не полностью моя разработка, изначально этот скрипт был найден на просторах буржунета, но впоследствии основательно мной переделанный. Так что часть авторства все же принадлежит мне ;)
Реализация формы обратной связи таким образом, когда ссылка на нее присутствует на каждой странице сайта и всегда в зоне видимости, очень удобна, а посетителям не придется долго её искать. Так же в эту форму можно добавить любые ваши контактные данные, например, ICQ, телефон или skype, в общем, все что захотите.
Итак, речь идет вот об этой штуковине --->
В работе вы можете увидеть эту форму на любой странице моего блога. Может быть, кто-то из вас ей даже пользовался.
Приступаем к делу. Чтобы получить такую же форму, вам потребуется выполнить два пункта — установка и настройка — они описаны ниже.
Архивы contactable UTF-8 и Windows-1251
Для сайта с кодировкой UTF-8: contactable.zip
Для сайта с кодировкой windows-1251: contactable_cp1251.zip
Как узнать кодировку своего сайта? Открываем сайт в браузере, нажимаем Ctrl+U (Просмотр исходного кода) и в самом начале находим строку:
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
или
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
Отсюда сразу понятно, какая у вас кодировка и, следовательно, какой архив необходимо скачать.
Как установить форму обратной связи?
В следующем разделе отдельно представлена установка для CMS WordPress.
Установка проходит в 7 шагов:
- Скачиваем архив в нужной кодировке и распаковываем.
- Вносим изменения в файлы mail.php и jquery.contactable.js (см. раздел настройка ниже).
- Папку contactable и все ее содержимое закидываем на сервер в удобное для вас место.
- В шаблоне своего сайта между тегами <head> и </head> вставляем следующий код:
где, http://site.ru/your/path/ надо заменить на путь к директории /contactable/ на вашем сервере.
<link rel="stylesheet" href="http://site.ru/your/path/contactable/contactable.css" type="text/css" /> - В шаблоне своего сайта ПОСЛЕ открывающего тега <body> вставляем следующий код:
<div id="contactable"><!-- contactable html placeholder --></div>
- В шаблоне своего сайта ПЕРЕД закрывающим тегом </body> вставляем следующий код:
<!--start contactable js --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1"></script> <script type="text/javascript" src="http://site.ru/your/path/contactable/jquery.validate.min.js"></script> <script type="text/javascript" src="http://site.ru/your/path/contactable/jquery.contactable.js"></script> <script type="text/javascript">$(function(){$('#contactable').contactable();});</script> <!--end contactable js -->
где, http://site.ru/your/path/ надо заменить на путь к директории contactable/ на вашем сервере.
Очень важный момент! Если у вас на сайте уже подключена библиотека jQuery (а в большинстве случаев это так), то второй раз подключать ее нельзя. В таком случае в коде выше надо убрать строку:
Иначе могут возникнуть конфликты — или форма не заработает, или сайт может «развалиться».<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1"></script> - Сохраняем файл шаблона. Обновляем любую страницу сайта и начинаем тестировать форму обратной связи!
Все готово!
Установка формы обратной связи для сайта на WordPress
Решил отдельно написать о том, как более удобно и правильно подключить данный скрипт для блога на движке WordPress.
- Скачиваем архив. WordPress по умолчанию представлен в кодировке UTF-8, по этому не ошибитесь с архивом ;)
- Редактируем файлы mail.php и jquery.contactable.js (см. раздел настройка ниже).
- Папку contactable вместе с содержимым заливаем в папку на сервере /wp-content/plugins/. То есть должно получиться так /wp-content/plugins/contactable/
- Идем в админке во «Внешний вид» -> «Редактор», выбираем файл header.php, находим там </head> и ВЫШЕ вставляем:
Жмем «Обновить файл»;
<script type="text/javascript">$(document).ready(function(){$('#contactable').contactable();});</script>
- Там же в редакторе открываем файл functions.php и в самый конец, перед ?> вставляем:
/*** Добавляем в wp_head свои css ***/ function my_css() { echo '<link rel="stylesheet" type="text/css" href="http://site.ru/wp-content/plugins/contactable/contactable.css" media="screen" />'."\n"; } add_action('wp_head', 'my_css', 5);
где, http://site.ru/ надо заменить на адрес своего сайта.
Данной функцией мы добавим в <head> </head> css файл стилей формы.
Далее, опять же перед ?> вставляем:
/*** Добавляем в wp_head свои js скрипты ***/ if( !is_admin()){ wp_deregister_script('jquery'); wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"), false, '1.7.1'); wp_enqueue_script('jquery'); wp_enqueue_script('validate', '/wp-content/plugins/contactable/jquery.validate.min.js', 'jquery', '1.8.0'); wp_enqueue_script('contactable', '/wp-content/plugins/contactable/jquery.contactable.js', 'jquery', '1.2.1'); }
Этим кодом мы делаем следущее: на всех страницах (кроме админки) мы отключаем стандартную вордпрессовскую библиотеку jquery, а вместо нее подключаем самую новую с серверов Гугла (не переживайте на счет того, что js будет подгружаться с внешнего сервера, во-первых, сервера Гугла самые надежные в мире, во-вторых, мы даже немного снизим нагрузку на свой сервер); далее после подключения jquery, сразу подключаются два js-скрипта формы связи с условием их поключения строго после jquery (это тот случай, когда порядок подключения скриптов имеет больше значение, и если не подключить jquery перед скриптами формы, то форма не заработает).
Жмем «Обновить файл». - Очищаем кеш, если у вас установлен плагин WP Super Cache или подобный.
- Обновляем любую страницу своего блога и видимо форму ;)
Как видите, ничего сложного в установке нет.
Настройка формы
Перед тем как заливать файлы из архива к себе на сервер (третий шаг установки), надо внести в них некоторые правки.
- Открываем файл jquery.contactable.js и находим там следующий код:
Как минимум нам надо изменить для переменной url путь к директории contactable/ на вашем сервере. Эта процедура аналогична четвертому пункту установки. Остальные переменные можете изменять по своему усмотрению.
var defaults = { url: 'http://site.ru/your/path/contactable/mail.php', name: 'Ваше имя', email: 'Ваш E-mail', message : 'Сообщение', subject : 'Feedback from MySite', page : location.href, submit : 'Отправить письмо', recievedMsg : 'Благодарю вас за письмо', notRecievedMsg : 'Извините, но при отправке письма произошла ошибка, попробуйте позже', disclaimer: 'Пожалуйста, не стесняйтесь отправлять сообщения. Я буду очень признателен за все отзывы и с радостью отвечу на все ваши вопросы!', hideOnSubmit: true };
- Открываем файл mail.php и находим там следующий код:
Здесь вам необходимо прописать свой контактный e-mail, на который будут сыпаться письма. То есть заменяем admin@site.ru на свой ящик.
$contactMessage = "Имя отправителя: $name <$emailAddr> $comment Письмо отправлено со страницы: $page IP отправителя: $_SERVER[REMOTE_ADDR]"; //send the email mail('admin@site.ru', $subject, $contactMessage, $headers);
Переменная $contactMessage содержит шаблон письма, которое вы будет получать. По умолчанию в шаблоне присутствуют имя и ящик отправителя, само сообщение, страница с которой было отправлено письмо (мне показалось, что это интересная информация для анализа) и IP адрес. Все это можете отредактировать как вам захочется. - По желанию можете изменять внешний вид самой формы, ее цвета и т.д., все css-стили хранятся в файле contactable.css
- На этом настройка завершена.
Всякие дополнительные фишки
- Если вы хотите, чтобы после отправки сообщения показывалось не только «Спасибо за письмо», но и происходило перемещение пользователя на заданную страницу, необходимо проделать следующее:
Открываем файл jquery.contactable.js и находим:$(this_id_prefix+'#callback').show().append(options.recievedMsg);
и НИЖЕ добавляем:
где нужно вместо http://alaev.info прописать адрес вашей страницы, куда вы хотите переместить пользователя.document.location.href="http://alaev.info";
Что еще стоит сказать про этот скрипт?
- Форма обратной связи с капчей уже не рулит, потому что данный скрипт работает только при включенном javascript, а у ботов он выключен, соответственно пользователям никакую капчу вводить не придется, а у вас не будет спама.
- После установки у вас может возникнуть проблема с кодировкой, поэтому проследите, что вы скачали подходящий архив (я специально подготовил две версии для скачиваиня). Сохраняйте файлы после редактирования в правильной кодировке (в большинстве случаев принудительно указывать кодировку не придется, но мало ли).
- На вопрос «А как сделать чтобы это было справа, а не слева?» отвечаю сразу — исходники открыты, колупайте на здоровье!
- Да, эта форма обратной связи не поддерживает аттачи. Но я считаю, что этого и не надо.
- А как сделать, чтобы после отправки сообщения форма не исчезала и можно было отправить еще одно сообщение без перезагрузки страницы? Ответ — никак!
- Пока все, но я буду добавлять сюда интересные вопросы из ваших комментариев, чтобы другие их больше не задавали ;)
Вот и все, надеюсь, для вашего сайта эта форма пригодится, пользуйтесь на здоровье!
Нет проблем! За умеренную плату в 500р мой специалист поможет решить любые проблемы и устранить все ошибки!
На подобные вопросы в комментариях автор поста (то есть Я) не отвечает.
Опубликовано 17 октября 2011
>> между тегами <body> и </body> вставляем следующий код
Тэг link никогда не ставится в body. Люди, которым важна скорость загрузки, скрипты ставят в футер, чтобы грузились они после отрисовки страницы и не тормозили ее.
Ну да, код можно разделить на две части, скрипты в футер, а вызов div с id в хедер.
А вообще замечание верное, обновил пост ;)
Так не будет работать. Вызов функции contactable () должен идти последним.
То есть:
1. стиль — в head;
2. div куда угодно в body;
3. скрипты перед закрывающим body в таком порядке:
— jquery.min.js
— jquery.validate.min.js
— jquery.contactable.js
— и потом уже $('#contactable').contactable ();
Все верно. Что-то я рассеянный какой-то вчера был. Спасибо еще раз!
Думаю для ценителей Joomla данный скрипт обратной связи будет логичен в модуле собственный HTML, только при этом визуальный редактор в настройках сайта на время отключать приходиться.
Я так понимаю данный скрипт работает сам по себе и можно его прикрутить к любому CMS?
Да, можно прикрутить не только к любой CMS, но лучше сказать, что можно прикрутить вообще куда угодно, лишь бы хостинг php поддерживал.
Как сделать вывод к примеру не слева, а ...
"Если нашли ошибку, нажмите сюда и сообщите" — вот эту надпись сделать кликабельной. Т.е. чтобы при нажатии на нее вылезала форма.
Если я правильно понял, то вам достаточно заменить надпись "Feedback" на "Если нашли ошибку нажмите сюда и сообщите". Но это уже фигня какая-то получится. Проще тогда специальным сервисом для этого воспользоваться — http://orphus.ru/, там все гораздо удобнее для ваших целей!
Пытаюсь добавить на сайт, пилил 2 дня. Допилил, вроде отправляет.
Но вот проблема: После отправки письма кидает на страницу "mail.php", а там 1 слово "success". Кто может помочь?
Насколько я понял, вместо слова должна срабатывать функция, и сообщение об успехе должно выводиться в той же форме отправки.
>> сообщение об успехе должно выводиться в той же форме отправки.
Это было бы глупо. Если сообщение отправлено, то форма уже не нужна. Найдите слово «Success» в jquery.contactable.js и замените его на свой html. Если сайт на Wordpress и многоязычный, то используйте /wp-includes/js/l10n.js, который грузится по умолчанию. Google в помощь.
Привет!!! Установил я форму обратной связи, но шаблон перекосило, сцуко (ощущение, как будто блокировали работу основных java-скриптов — галерея перестала работать и т.д.).
На перекос шаблона влияет эта строка в коде:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>Я так понимаю, что получается какой-то конфликт между скриптами, потому как шаб навороченный уж чересчур...
Может кто сталкивался? В Java не силен я вовсе. Помогите, ребят, с этой проблемой...
Попробуйте не вставлять эту строку, возможно, у вас подключается несколько jquery одновременно, и потому возникают конфликты.
Пробовал, тогда feedback не подгружается совсем. Как же быть...? У меня сайт на CMS joomla, существует модуль feedback, но, он немного кривоват, периодически тормозит по ходу своего "выдвижения"... А Ваш вчера тестил — понравилось!
У меня только что была такая же проблема! Одно подключишь — другое развалится!
Уберите внешние файлы jquery (типа http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js). Скачайте библиотеку jquery отсюда: http://docs.jquery.com/Downloading_jQuery. Кидайте на сервер и подключите ее на свою страницу с плагинами.
У меня все сразу нормально заработало. Удачи!
И еще раз спасибо Александру за замечательный скрипт формы! Красиво и удобно.
Сделал как Вы написали: заменил строчку подключения внешнего jquery на подключение из папки на сервере (скрипт скачал версии jquery-1.3.min.js). Такая же лажа...
А в другом шаблоне joomla вообще html файла нет. Там через warp шаблон работает. Вот и думай куда код прописать!?
Или я опять все преувеличиваю :)
Я скачивала jquery-1.7.1.min.js. Насколько я правильно поняла, у них там все версии постоянно обновляются, а эта — последняя. Все сразу на места встало. Хотите, ссылку дам — посмотрите. А файл я прописала в <head>.
Скачал последнюю версию jquery-1.7.1.min.js — панелька выезжает, но сайт принципиально не хочет с панелькой дружить. Скорее происходит какой то конфликт скриптов. Не знаю в общем, что происходит... Если будет полезная информация по этому вопросу пожалуйста поделитесь. Спасибо!
А Вы все внешние подключения jquery на странице удалили? У меня все плагины работают на 1.7.1. А когда было 3 штуки разных — для каждого плагина свой внешний файл, все и разваливалось.
А вот и не знаю... Не смотрел. Значит, лучше все запросы на внешнее подключение скриптов убрать? Чтот даже и не подумал про это... попробую отключить внешку, может, что и получится-)
1. JQuery должна грузиться ДО всех скриптов, использующих ее. Вне зависимости внешние они или локальные. Проверьте порядок загрузки.
2. Попробуйте заменить вызов
на
3. Если используется другая библиотека, например, Prototype, то inline-скрипт может с ней конфликтовать. Но не в случае, упомянутом выше (2).
У меня был конфликт слайдера с этой Обратной связью — коробило сайт и не работал слайдер.
Я решил эту проблему следующим образом:
Скопировал ***.js который крутил слайдер, в начало файла "jquery-1.7.1.min.js".
Как ни странно, все заработало!
Надеюсь, если у кого конфликты скриптов, попробуйте скопировать текст вашего скрипта в "jquery-1.7.1.min.js".
Автору Обратной связи — Респект за труд!
Привет. Перво-наперво спасибо за форму. Вот только раскорячило у меня поле "Ваше имя" на сайте hypalon.ru. Где искать баг?
Скорее всего надо смотреть стили css.
Спасибо, допилили и поставили. Вот только у сайта есть алиас и когда отправляет с него, то пишет "...попробуйте позже..."
Не понял...
Есть сайт site1.ru, у сайта есть алиас site2.ru, когда отправляешь форму с первого, то пишет, что отправлено, а со второго, что "...попробуйте позже".
P.S Решил написанием относительного пути к contactable.js
А какой смысл иметь одинаковые сайты на двух доменах? Логично сделать 301 редирект на один из них (основной) и никаких проблем ;)
Хотя, конечно, может не так все и просто и разные домены сделаны специально, я не знаю...
Сталкнулся с такой проблемой... Форма грузится, письма уходят, но почта пустая.
Где искать проблему?
А в файле mail.php свое мыло прописали?
PS Проверьте на всякий случай папку спам, мало ли...
Да, мыло прописал. Пробывал мыльник и на своем сервере и на mail.ru. В спам папках пусто.
Блин, тогда сложно сказать в чем дело, я не знаю :(
В url: 'http://site.ru/your/path/contactable/mail.php', пропишите не полный путь, а относительный, т.е. url: '/contactable/mail.php'. В противном случае форма будет работать, если обращаетесь к сайту по адресу http://site.ru/, и не будет, если по http://www.site.ru/.
Это проверенное наблюдение или лишь догадки?
Я склоняюсь к тому, что это не может быть причиной неработы скрипта.
Форма прикрутилась на сайт отлично. Но вот загвоздка. Не отправляются сообщения, хотя все поля заполнены. Вместо отправки пишет сообщение — "Извините, но при отправке письма произошла ошибка, попробуйте позже"
В чем может быть причина. Сделал все так как вы описали.
Если тестируете на локальном сервере, то там есть такая проблема.
Тестируется не на локальном сервере.
Форма работает, а отправлять не хочет. Все права на файлы указаны верно. В httpacess тоже все прописано.
Такое ощущение что в php файле пролетает условие. Вернее, скорей всего, в php файл ничего не приходит
Надо еще раз проверить, правильно ли указаны все пути, иначе я даже не знаю, в чем у вас может быть дело!
Работает в мозиле, хроме, опере — В Explorer версии 7 и 9 отказывается, все выезжает нормально, но страница сдвигается, отображается форма не полность и т.д.
Но если открыть вашу страницу http://alaev.info/blog/post/2681 , то все идиально.
АВТОР В ЧЕМ СЕКРЕТ У ВАС? Ничего не менял в скриптах, просто залил, почему в Explorer коряво отоброжается? Спасибо за ответ!
Нет никакого секрета, 99% вероятность ошибки в ваших css-стилях.
А на счет IE — в старых версиях не поддерживается абсолютное позиционирование, но в этом случае и на моем блоге будет такая проблема.
Была такая же проблема.
В файле css продублировала хаки для ie6 (например: *position:absolute;) хаками для всех ie (//position:absolute;)
И форма заработала как нужно =)
XenForo, при попытке редактирования шаблона, выдает ошибку синтаксиса в строке
"<script type="text/javascript">$(function (){$('#contactable').contactable ();});</script>".
Как исправить, подскажите...
Разобрался!
Если у кого-нибудь будет подобная проблема, делайте так:
<script type="text/javascript">
$(function (){
$('#contactable').contactable ();
});
</script>
В архиве все файлы в UTF-8, вы могли бы залить еще и для windows-1251. Мучаюсь какой день, не могу перекодировать. Поместите в архив файлы для обеих кодировок, или залейте еще один архив.
Notepad++ отлично перекодирует и http://www.artlebedev.ru/tools/decoder/ вроде тоже
Да, любой нормальный текстовый редактор может сохранять в различных кодировках.
Но все равно в пост добавил еще один архив для cp-1251 кодировки.
Такс... А у меня появилась проблема: Письма приходят, сам текст в письме читаемый, а От кого и Тема письма кракозябры :(
В чем может быть проблема?
Прикрутил данную форму все ок, но работает криво и письма не приходят. Криво скажу почему, форма не обновляется и не пишет, что письмо отправленно, а просто перезагружает исходную страницу. Че может быть товарищи?
Все заработало. Дело в том, что я добавил поле телефон, только вот оно добавилось, а работать не захотело.
Может есть способ правильно прописать поле телефон чтобы все корректно работало?
to Brendmaster
Способ, для дополнительного поля, скажем, для телефона, есть пример тут: http://luali.ru
Если коротко, то в форме mail.php пишем переменную $phone:
А в файле jquery.contactable.js:
1. Надо добавить:
2. Воткнуть после поля почты вот эту строку:
Пример:
3. Добавить здесь:
4. Вписать тут:
5. Самое незаметное тут:
6. У меня все работает и отправляется! Все красиво и удобно.
Единственная загвоздка это отображение панели в долбаном IE...
Да вот нет... Все работает! И письма приходят и форма обновляется...
После отправки пишет то, что указали в jquery.contactable.js а именно в: (recievedMsg : 'Благодарим вас за сообщение',).
Единственно, была проблема, скрипт писал «Отправка невозможна». Из-за прав доступа к файлу mail.php, изменил права и заработал.
Но теперь проблема в кодировке. И что странно, на почту яндекса приходит все читаемо, а на почту хостера, только тело письма читать можно, а From и To (От кого и Тема письма), кракозябры...
Я конечно понимаю, что Яндекс почта для дураков. Им не выгодно, что бы пользователи вникали в стандарты RFC и поэтому сделали всё, что бы мы (юЗвери), не доставали их саппорт тупыми вопросами :)
Ну а форму, можешь глянуть: http://веселый-потолочник.рф. Это если ссылка пройдет и не сочтут за рекламу или спам.
Как-то так, дружище Brendmaster.
Да форма у меня уже работает. Я просто хотел поле ТЕЛЕФОН еще добавить, а когда его добавил, перестало работать, ну а теперь убрал и все ок.
Какой код вставляешь для поля телефон?
PS Можешь на аську стукнуться. Вместе подумаем. Я тоже планирую телефон вставить. (481пять9пять9)
Я в форме mail.php и в скрипте jquery.contactable.js дублировал просто код для емаил и изменил id на phone.
С телефоном разобрался — вот коды, ну если кому надо (файл mail.php):
а вот изменения в jquery.contactable.js
Вот только как добавить поле с выбором темы из списка открывающегося, никак не могу догнать.
Забыл в css файле contactable.css надо добавить в самом низу строчку строка около 100-106
#contactable #phone.error { background-color: #EDBE9C; }
если не добавить, то если поле телефон не заполнено оно красным выделяться не будет
Ну и наконец подскажите пожалуйста кто-нибудь как сделать поле ТЕМА СООБЩЕНИЯ с выбором тем из открывающегося списка, буду очень благодарен, да и многим пригодиться я думаю
Brendmaster — Привет. Я обязательно этим займусь, после того, как Яндекс закончит мудить со сменами алгоритмов ранжирования... Еле успеваю менять стили раскрутки, подстраиваясь под него. Клиенты нервничают и приходиться вкалывать по полной. (((
Классная форма обратной связи, давно такую искал. Сделал все по инструкции, но форма не прячется за край страницы, а все время находится поверх страницы сайта. Т.к как я совсем не разбираюсь в программировании, сделать ничего не могу. Может кто подскажет как исправить данную неприятность...
Тут дело скорее всего в css стилях. Уже надо на реальном сайте смотреть реальный случай.
Обратитесь вот к Brendmaster'у, он, я смотрю, разбирается тоже :)
АлаичЪ, а ты может поможешь с списком открывающимся с выбором темы сообщения? А то я уже всю голову сломал
Помочь-то смогу, но только через неделю, не раньше, извини. Я сечас в отпуске, с лялей няньчусь, времени вообще нет.
Насколько я понимаю дело не в настройках, а в месте расположения кодов на страницах шаблонов. Или я не прав?
Скорее всего. Надо смотреть на самом сайте
Перепроверил. Вроде все правильно. Но по прежнему не прячется :(
Выдержка из кода страницы.
А у вас библиотека jquery не подключена случайно повторно? Это во-первых, а во-вторых у Вас второй слеш вот тут:
http://inhoteb.jino.ru//contactable/jquery.contactable.js
Про библиотеку не знаю, т.к не понимаю о чем речь, а слеш сейчас исправлю, спасибо за наводку
скинь мне на почту index свой, я посмотрю brendmastermilano@gmail.com
Фаил скинул. Проверил работу скрипта в дримвивер, все прекрасно работает )) а на сайте не хочет
Отправил, проверь. Код у тебя очень корявый, фиг найдешь )))
Посмотрел сайт, это, конечно, жесть, но что уж...
Как я и говорил выше, я продолжаю грешить на ваш style.css. Попробуйте его из кода страницы внеменно удалить и проверить работоспособность формы, должна заработать.
Да я же говорю, абсолютно не понимаю в программировании, собирал в конструкторе.
В любом случае, спасибо вам за помощь, хотя и ни чего не вышло ))
Да, действительно, удаление style.css из кода страницы помогло, но полностью "разобрало" страницу на составляющие ))
Видимо не судьба )
Значит дело в конкретных стилях сайта, а так как ваш style.css вообще не поддается приручению, я его изучил и он совершенно не человекопонятный, то тут надо либо самому копать, либо прочить кого-то.
У меня по началу не работал (Не отправлял сообщения -писал ошибку)
Я заменил файл jquery.validate.min.js на другой такой же скачанный с сайта (Указанном в jquery.validate.min.js) то есть адрес
http://bassistance.de/jquery-plugins/jquery-plugin-validation/
отсюда я его скачал и заменил на последнюю версию, а именно 1.9
Но у меня с начала такая проблема. (Сайт у меня на jquery- ну у него страниц несколько и они переключаются без обновления сайта.) так вот после установки (<div id="contactable"><!-- contactable html placeholder --></div>) то есть кода который выводит. У меня сразу страницы стали в ряд (То есть изначально на главной странице 1, а после установки скрипта сразу они все выскакивают и отображаются по очереди вниз.
хотя нет, отправка появилась после изменения пути в файле (jquery.contactable.js) там я до файла mail провел такой путь (/123/feedback/mail.php — вместо того что было бы http://site.ru/123/feedback/mail.php)
Надеюсь я кому-то помог, помогите и мне с проблемой указанной выше...
Проблема решена! Удалил из этого кода:
Вот эту строку:
<script type="text/javascript" src="/jquery/1.7.1/jquery.min.js"></script>И все заработало.
Да, два раза подключать jQuery библиотеку — это ошибка. Надо сделать пометку в посте. А но народ, как всегда, наломает дров, а потом не знают почему так получается ;)
Добрый день!
Подскажите как поставить сюда капчу ?
Никак, читайте внимательно пост! Там написано, что капча не нужна — боты не смогут спамить в эту форму, так как работает она через яваскрипт.
Извиняюсь, просто смотрел в книгу и самого главного не заметил )
А подскажите, как реализовать, чтобы при нажатии на кнопку отправить месседж уходил на почту, но также при нажатии открывалось определенное окно?
Смотрите дополнительный пункт в посте под названием "Всякие дополнительные фишки".
Добрый день!
В IE не отрабатывает плагин валидации(критично, что в поле эл.адреса можно указать дребедень).
Пытались победить данную проблему?
В IE9 точно работает, только что проверил. Других версий у меня нет, да и вообще я давно перестал поддерживать функциональность для старых IE, мне жалко людей, использующих эти браузеры :)
IE 7, IE 8 — даже если поле подсвечивается красным, по жамку на "отправить" письмо уходит.
*для теста можно включить режим обратной совместимости (кнопка справа от адресной строки браузера).
Да, я также не сторонник ИЕ. Но этим браузером до сих пор пользуется порядка 50% юзеров инета. Не поддерживать данный браузер пока что, как минимум, неправильно, как максимум нельзя. Я не говорю сейчас о частных блогах.
Ок. нет так нет. Буду разбираться)
Ваша правда. На IE9 все работает как надо, а вот в режиме совместимости валидатор не отрабатывается :(
Но на счет 50% доли IE вы не правы: Explorer 8 — 7%, Explorer 9 — 4,9%, Explorer 7 — 2,6%, Explorer 6 — 1,1%. Итого доля «печальных» пользователей 7+2,6+1,1=11,7% — а это далеко не 50%! Я в подсчетах исключил IE9, так как в нем все ок, даже css3 поддерживается.
Поставил, настроил — огромное спасибо за рецепт!
Вот только оказалось, что часть посетителей сайта в упор не видят кнопочку у левого края окна (которая у Вас называется "Feedback").
И что самое печальное — среди этих посетителей оказались заказчики. Искать другой скрипт желания нет — уж больно Ваш хорош. То есть возникла необходимость продублировать кнопку "Feedback" текстовой ссылкой на той же странице.
Конкретно: как вызвать срабатывания функции "открыть форму" через клик на тексте "Задать вопрос" (или на какой-нибудь картинке) в теле html-страницы?
Буду очень признателен, готов перевести вэб-мани за ответ.
Без проблем, необходимо сделать обычную ссылку, только вместо атрибута href="..." необходимо написать onclick="..."
В итоге должно получиться что-то в духе <a onclick="$('#contactable_inner').click (); return false;">*тут анкор ссылки*</a>.
PS Решение подсказал мой любимый программист Саня Фомин, отблагодарить можно его, ему будет приятно.
Реально заработало вот в таком виде:
<a onClick="$('contactable_inner').click (); return false;">Задать вопрос</a>
(один "#" оказался лишним).
Для тех, кто будет пытаться это применять просто копируя, для начала лучше использовать вот такую строку:
<a href="" onClick="$('contactable_inner').click (); return false;">Задать вопрос</a>
— без "href="" текстовая ссылка просто так не отобразится.
В любом случае спасибо за оперативную помощь, пойду переводить обещанные вэб-мани.
Удивительно, что заработало без решетки #, а точнее удивительно, что не заработало с ней. Потому что правильно именно с решеткой, это указатель id.
И без href ссылка отобразится ;) Стили же обычно прописываются применимо к элементу <a>, а потом дополнительно для :hover, :active, :visited. Наверное у вас не так...
Ну да ладно, не буду грузить, главное что заработало.
А между href="" что писать, я не понял?
Сам разобрался, вот так сработало:
<a onclick="$('#contactable_inner').click (); return false;">Задать вопрос</a>
Ребята, помогите, пожалуйста!!!
На сайте с доменом .com все отлично работает. Ставлю форму на сайт .рф — ничего не отправляет! Причем, если в contactable.js прописать путь к файлу .php, который лежит на другом сайте с доменом .com — письма приходят, но в форме появляется надпись "произошел сбой при отправке". Может, причина в русскоязычном домене?
Может, кто-нибудь подскажет где копаться?
Все работает, я только что проверял на своем домене алаичъ.рф. Только есть особенность, адрес надо указывать в таком виде — http://xn--80aayk6ds.xn--p1ai/ (тут как раз и написано http://алаичъ.рф/).
Так что следуйте инструкции, и где надо заменить site.ru на свой сайт, пишите адрес в указанном виде.
Да, Александр, Спасибо! Я и в такой кодировке url указывала — ничего! Все с другой стороны оказалось. Тарифный план на хостинге, оказывается, не поддерживает php и MySQL!!! А я, как обезьяна, два дня в коде ковырялась!!! Хорошо — додумалась у них спросить в чем дело, а то бы с ума сошла. Вот, иногда полезно совсем с другой стороны посмотреть на проблему. План сменили, завтра попробую поставить. Еще раз Спасибо!
Да, бывает отказывается и такое :)
Отпишитесь потом, заработало ли все правильно.
Ура!!! Все, как Доктор прописал!!! Он же — Александр Алаев!!! :)
Настроил, все работает, одна проблема осталась — научить отправлять письма на почтовые ящики со спецсимволами.
К примеру, если я в mail.php прописываю свой ящик office-worker@ya.ru, т.е. ящик со знаком — , то письма не приходят, а если прописываю другой ящик, который не имеет в имени спецсимволы, то приходит письмо нормально.
Должно работать.
Я проверил для своего ящика, который содержит в адресе нижнее подчеркивание "_" — письмо нормально дошло.
Установка формы обратной связи для DLE DataLife Engine 9.4
1. Скачиваем архив в нужной кодировке и распаковываем.
2. Вносим изменения в файлы mail.php и jquery.contactable.js (см. ниже).
3. Папку contactable и все ее содержимое закидываем на сервер в папку вашей темы оформления (шаблона), т.е. /templates/ваш_стиль/. При этом файл mail.php из этой папки заливаем в /engine/modules/.
4. В шаблоне своего сайта main.tpl между тегами <head> и </head> вставляем следующий код:
<link rel="stylesheet" href="{THEME}/contactable/contactable.css" type="text/css" />5. В шаблоне своего сайта main.tpl ПОСЛЕ открывающего тега <body> вставляем следующий код:
6. В шаблоне своего сайта main.tpl ПЕРЕД закрывающим тегом </body> вставляем следующий код:
Очень важный момент! Если на сайте уже подключена библиотека jQuery (а в большинстве случаев это так), то второй раз подключать ее нельзя. В таком случае в коде выше надо убрать строку:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1"></script>Иначе могут возникнуть конфликты — или форма не заработает, или сайт может «развалиться».
7. Сохраняем файл шаблона. Обновляем любую страницу сайта и начинаем тестировать форму обратной связи!
Перед тем как заливать файлы из архива к себе на сервер (третий шаг установки), надо внести в них некоторые правки.
1. Открываем файл jquery.contactable.js и находим там следующий код:
Как минимум надо изменить для переменной url путь на указанный: '/engine/modules/mail.php'. Остальные переменные можете изменять по своему усмотрению.
2. Открываем файл mail.php и находим там следующий код:
Здесь вам необходимо прописать свой контактный e-mail, на который будут сыпаться письма. То есть заменяем admin@site.ru на свой ящик.
Переменная $contactMessage содержит шаблон письма, которое вы будет получать. По умолчанию в шаблоне присутствуют имя и ящик отправителя, само сообщение, страница с которой было отправлено письмо (мне показалось, что это интересная информация для анализа) и IP адрес. Все это можете отредактировать как вам захочется.
3. По желанию можете изменять внешний вид самой формы, ее цвета и т.д., все css-стили хранятся в файле contactable.css
Можно пользоваться.
Спасибо за комментарий, однако было много ошибок и неточностей, но я исправил и оформил. Добавлю ссылку на коммент в пост.
Здравствуйте. Подскажите можно ли эту форму использовать на сайте от Ucoz?
Заранее спасибо.
Не знаю. Если там разрешается использование php, и есть возможность загружать файлы на сервер, то да.
Добрый день.
Установил ваш скрипт, спасибо большое (еще утащил временно ваш дизайн, уж больно он хорош).
Но при отправке почему-то выдает "Извините, ошибка...", вроде все пути прописал верно, перепроверил разные варианты. Где можно искать ошибку?
При этом, если просто запустить mail.php — письмо (пустое конечно) успешно приходит на заданную почту.
Хм, не знаю даже, тут может быть дело только в путях к файлам на сервере, больше никаких причин не знаю. Возможно еще права на файлы можно проверить, хотя вряд ли в этом может быть дело.
Спасибо.
Вот правильно я понимаю, что если файл открывается просто в браузере, то адрес прописан правильно?
Ведь не может же он просто брать и не работать?
Ну логично...
Вообще затрудняюсь ответить, где именно сбоит скрипт. Попробуйте на другом сайте, например (только не на локалке, на локалке работать на будет).
Попробовал на другом сайте. Взял заново весь скрипт, положил в корень, указал относительные пути. Все видно, но та же ошибка :(
Уже даже синтаксис посмотрел, думал, что проблема в строчке вызова url.
Но вроде все ок, он явно просто не может достучаться до mail.php
Менял им доступы даже на 777 — все равно ошибка. Как бы посмотреть где он затыкается? :(
Все! Решил! Блин блинский! Я подумал, что строчка
echo ('success'); //return success callback
Вернет мне просто слово success и совсем не подумал, что это функция вызова и заменил ее на благодарственные слова. Идиот :)
Извините за беспокойство. Спасибо за скрипт. Очень полезно!
Огромное спасибо за скрипт!
Хочу уточнить — сделал ли кто-нибудь селект с выпадающим списком частью формы? Если да, поделитесь, пожалуйста, кодом.
Возникла проблема при подключении на DLE. Все добавил, но подключение формы не происходит, не умею отлавливать такие проблемы.
Можно комментарий к данному мануалу в применении к DLE.
Чуть выше в комментариях описывали последовательность действий для DLE — #comment-8436.
Привет. Спасите чайника. Не нашел нигде более подходящего скрипта чем этот (на самом деле мне нужен еще проще — просто текстовое поле, но это я сам допилю). На основной сайт не ставил, пытаюсь прикрутить к простому HTML на другом сайте. Не входит хоть тресни. Все работает, показывается-прячется, письмо отправляется. НО! Окно не ложится поверх сайта, а вкрячивается там где его строка — сейчас, например, над всем сайтом сразу. Плюс ко всему еще и оформления нет вообще, все коряво... Что за дела?
http://www.trafaret.tv/index2.html
Что делал:
1. Сделал все тщательно по инструкции.
2. Прочитал все посты сверху донизу, блин — у всех работает!
3. Отключал жиквери.мин, не помогло — все пропадает.
4. Отключал свои стили сайта. Нет изменений вовсе.
5. Посмотрел код этой страницы, тупо скопировал все линки на ЦСС-ки и вставил на свою страницу — оформление "закладки" стало как у тебя тут, но на выехавщей форме — корявость...
6. Выпил 5 литров пива, побился головой об стену и пошел спать. На утро — все тоже самое.
F1. Плиз.
UPD: не работает (то есть криво выглядит и страницу бъет) только в ИЕ9. Мозилла, Опера, Сафари с айфона — все ОК, дизайна только нет (есть то бишь оригинальный).
Ну что я могу сказать, раз везде, кроме IE отображается путем, то проблема в css стилях и только в них.
Надо разбираться со стилями, но я этого делать не буду, это куча времени. Вам надо обратиться к верстальщику, он подскажет, где происходит конфликт.
Люди добрые, а подскажите пожалуйста как эту форму параллельно вставить в хтмл код сайта? Тоесть у меня все получилось с выдвижной формой, а мне дополнительно нужно ее вставить в страницу сайта. Чтобы она находилась в статическом виде на странице.
И еще вопрос, можно ли сделать так, чтобы когда выдвигается форма обратной связи, остальное поле затенялось? Тоесть допустим как в лайтбоксе при всплывающей картинке фон сайта затеняется.
Заранее благодарен за внимание!
Привет! Установил форму на свой сайт, прочитал все внимательно. Форма выезжает нормально, хотя отображается не так как на вашем сайте, хотя отключил все свои стили. Но проблема в другом. После заполнения формы нажимаю отправить — появляется надпись "Извините, при отправке письма произошла ошибка ... и т.д." И все — форма не заезжает обратно. Долго бился, менял пути, ставил относительные и абсолютные, менял адрес отправки сообщения, обновил версию jquery.validate.min.js, изменял права доступа ко всем файлам до 777. Все бесполезно. Но когда заглянул в почтовые ящики — обалдел, все письма, которые отправлял дошли до ящика, причем это вообще не зависит от путей (относительные и абсолютные) и прав доступа (сейчас оставил 644).
Какие есть идеи, почему выдает такое сообщение, хотя форма работает и почему не заезжает обратно??
Заранее благодарен за ответ!!!
Можно забить костыль на такую проблему :)
В файле jquery.contactable.js
Найдите:
Замените на:
Вопрос, можно ли его переделать под форму "Заказать звонок". Точнее надо просто убрать проверку "email", иконку я уже дорисую сам. Подскажите где это надо править.
Смотрите файл jquery.contactable.js
Вот в этом месте
$(this).html (' ... ');формируется html-код самой формы.Я тут комменты выше почитал, попробую сделать как там.
Чтоб в форме были поля «Имя», «Телефон» и «Комментарии» надо найти вот это:
И заменить на это:
Можно. Но на почту "телефон" не придет ;)
А что сделать что бы телефон приходил?
Такая проблемка:
На страничке с фотографиями у меня стоит lightbox , так вот, если я встраиваю данный скрипт на эту страничку перестает срабатывать плавное всплытие картинок. Мешат срабатыванию строчка:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1"></script>
Удалив только ее все норм работает, как мне быть подскажите.
Пытался код вставляемый перед закрытием </bodi> ставить вначале боди, тоже лайтбокс не работает.
Как я и писал в посте, jQuery не должен вызываться дважды на странице. Так что вам надо сделать так, чтобы он не вызывался два раза. Попробуйте удалить из lightbox'а вызов jQuery оставив только тот, что подгружается моей формой.
Сегодня пройдусь еще раз по коду, нет ли там второго вызова jQuery (код не мой просто)
Наконец-то настроил, всё заработало! Спасибо вам за отличную форму!
Есть вопрос: После отправки сообщения форма полностью прячется, включая кнопку FREEDBACK, и не показывается до обновления страницы...
Скажите, так и должно быть?
Да, так и должно быть.
Добрый день. Спасибо за форму! Просто шикарная. Но заметил одну проблему под новым фаерфоксом — полю ввода самого сообщения можно менять размер. Как в принципе и тому полю в котором я сейчас ввожу сообщение. Тянешь за правый нижний угол и вуаля.
Может знает кто как это пофиксить?
Да ерунда это все :)
В css стилях формы добавьте строчку resize:none; — должно получиться примерно так.
Спасибо.
Ещё такой вопрос:
Воткнул в шаблон joomla 1.5. на одной странице исмользовал mod_ice_accordion (модуль плавного открытия контента) и модуль стал отображать все посты всегда открытыми и не свернуть. Конфликт с jquery.min.js. Вожно ли их подружить? Или подскажите где копать)
Как я и писал, подключаться должен только один jquery. Попробуйте при установке формы не подключать jquery, и ошибка пропадет.
Да, это я в курсе.
Убирал её из подгрузки. Тогда исчезает обратная связь. С чем ещё может быть проблема?
Задам ещё один глупый вопрос недано начавшего самоучки :)
Какие функции из jquery использует Ваша форма?
А то впечатление, что или одну и ту же переменную библиотеки используют, или ещё какая фигня с именами функций.
Думаю может вырезать нужные для формы из самой библиотеки, да попробовать, заработает ли. Или сие пустая трата времени будет?
PS Ещё раз спасибо за форму и за помощь. Пойду изучать java и css с php :)
Возможно, что версия jquery, которая используется вашим аккордеоном старая, а в ней нет тех функций, которые нужны форме. Предлагаю попробовать обратный вариант — не подгружать jquery от аккордеона, а вот от формы подгружать. В таком случае все должно нормально работать.
Приветствую.
Спасибо, Александр, за отличный скрипт формы!
Я с просьбой, не получается у меня толком поменять расположение формы, привязав её к низу, и чтобы вверх открывалась. Может кто уже сделал себе. Подскажите, пожалуйста.
Там надо менять css-стили и вносить правки в js-скрипт, чтобы изменить расположение. Если готовы колупать файлы, то можете попробовать, но я бы не рекомендовал.
Доброго времени суток!
Искренне благодарю вас, использовал данную форму в своем первом сайте, эта форма, так сказать, стала отправной точкой в нём! ОЧЕНЬ помогло, еще раз спасибо!
Здравствуйте, столкнулся с такой проблемой. Поставил форму по инструкции, результат оказался следующим: в самом верху сайта, форма обратной связи (без эффектов въезжания, а только чистая html форма), как можно исправить?
Все, спасибо, разобрался — стили не подключались :)
Новый вопросик, все прекрепил, все работает, кроме:
Поле имя на почтовик приходит иероглифами, все остальное приходит нормально, в чем проблема?
Можно попробовать изменить в файле mail.php кодировку отправляемого письма на windows-1251.
Хотя странно, что имя приходит неверно, а все остальное нормально...
Здравствуйте.
Спасибо, наконец-то то что нужно. А то все искал js+capcha... Прикрутилось с первого раза. Однако вот имею проблему в юзабилити:
Если
hideOnSubmit: true, то после успешной отправки сообщения, форма уезжает совсем. Даже ярлычок, на который надо нажать, чтобы форму раскрыть.Если
hideOnSubmit: false, то после успешной отправки сообщения, форму пишет — "собщение отправлено", ее можно скрыть, но при повторном раскрытии видим то же "собщение отправлено". Приходится обновлять страницу.Подскажите, где подкрутить, чтобы форма возвращалась к исходному состоянию?
Такой вариант работы не подразумевается данной формой. Если пользователям так надо отправлять сразу кучу писем, то в текст "сообщение отправлено", добавьте что-то в духе "для отправки еще одного сообщения перезагрузите страницу".
Я вставляю скрипт по инструкции, всё работает только нет таблички отправить письмо, почему??
Не знаю. Скорее всего надо стили смотреть.
Никита, в файле contactable.css на 24 строчке поменяй высоту, например я выставил
height:550px;
можно больше...
Александр, помогите пожалуйста разобраться со style.css (скорее всего это он) — почти все работает как нужно, единственный момент — окно сообщения статично, стоит на месте и незаезжает-невыезжает, а сам ярлычок feedback прячется-выезжает как нужно и сообщения тоже отправляются, подскажите где копать, пожалуйста.
При удалении style.css форма работает как и должна, но теряется все оформление сайта.
Непростая проблема. Где копать — в css стилях, где же еще =)
Не глядя сказать невозможно в чем проблема. А мне разбираться с этим некогда, попробуйте обратиться к какому-нибудь верстальщику, он поможет.
Нашел ошибку у постера... andron2900 (2 комм.)
21.03.2012 в 22:25 Установка формы обратной связи для DLE DataLife Engine 9.4
файл jquery.contactable.js и код:
Вместо url: 'engine/modules/mail.php',
Нужно писать url: '/engine/modules/mail.php',
— как сделать чтобы при получении письма в поле"От кого" стоял адрес отправителя а не своего сервера? Спасибо!
Спасибо, исправил коммент.
Вот примерный кусок кода из моего файла mail.php
Сперва огромное спасибо! Подскажите пожалуйста, такова проблема. Залил... все отобразилось — отлично. Проверяю. Письма — нет... проверил mail.php. Все нормально, потом думаю попробую тыкнуть при пустых полях... И о боже... окно прячется и все... т.е. как я понял не отправляется ни чего... не выскакивают ошибки о пустых полях. В чем может быть проблема?
Заработало... В чем именно была причина не понял. Все переписал и перезалил. Теперь точно спасибо!
Все поставил, все работает, вот только на почте пусто...
Путь писал уже и относительный и абсолютный, что делать не понимаю.
Пишет спасибо за сообщение, а на почте пусто.
Может в спам попало или еще что. Попробуйте разные ящики указать.
Интересно, а кто пробовал его прикрутить для ucoz? Очень интересно...
На укозе есть свой конструктор форм. Не хуже этого. Просто поиграйся и настрой.
Другое дело, что укоз только для начинающих. Раскрутишь немножко сайт — пойдет трафик — нагрузку сервера укоза не выдерживают — твой сайт на помойку выкидывают :)
Привет! Сделал все по инструкции для Wordpress, ничего не происходит! Чистил кеши, разные браузеры — все безрезультатно! Не подскажешь?!
Не подскажу, откуда мне знать в чем там проблема. Может скрипт не подключили, или наоборот два раза подключили, откуда мне знать...
Здравствуйте. Столкнулся с такой проблемой письма отправляются но приходят они в папку спам как можно решить эту проблему?
В чем конкретно дело не могу сказать. Но замечал, что если заголовок письма полностью на английском (на латинице, то есть), то может попадать в спам.
Первое, неизвестно на какой ящик отправляешь!
Если это частный ящик, смотрим в анти-спам фильтрации данного сервера.
Если это ящик по типу Yandex, Mail.ru и других подобных почтовых сервисов, то у них свои специфики фильтрации и надо смотреть в их настройках.
А вообще правильнее, это идти в их адресные книжки и добавить адрес. Далее прописать правило, что придя сообщение с ххх адреса пихать его в оную папку))
Добрый день, такая проблема...
Если вводить имя отправителя на русском языке, письмо не приходит, если на английском — то всё в порядке...
В чём может быть проблема?
Не знаю, у меня проходят письма с любыми именами, и на латинице и на кириллице.
Странно... Движок вордпресс... Может это хостинг шалит, не подскажите?
Честно говоря даже и не знаю, я расписал в посте все именно так, как сделано на данном блоге и у меня...
To all
Если кому не сложно подсказать решение проблемы.
Во всех обозревателях отображается нормально, кроме нашего любимого IE. Причем неважно какой версии.
Страница: http://luali.ru
Форма размещена ниже как будет видно, проблему.
Сама форма отказывается быть поверх странички и занимает область равную ее высоте.
Перепробовал уже:
Все библиотеки, отключать поочередно и все сразу.
Все стили.
И порядки их размещения.
Единственное что могу сказать методами исключения, возможно "проблема" в файле jquery.contactable.js
Из-за специфики IE в прочтении данных в этом файле.
Форма безусловно отличная...
Но может кто подскажет как ее интегрировать в страницу, т. е. чтоб форма была расположена не в модальном окне, а в самой странице?
Такой вариант не подразумевается. Но есть вариант вызова формы при помощи ссылки в тексте, например.
Как это сделать, описано тут — #comment-8375
1. Как узнать установлена/подключена ли библиотека jQuery на сайте? Я чайник!
2. Вы что все мои вопросы за спам приняли — почему снова 1 коммент показывает?
1. Открыть исходный текст страницы и произвести поиск по фразе jquery. Цель — найти или jquery.min.js или jquery.js
2. Нет, просто я для комментариев изменил ваш ящик на @gmail.com. Так что подсчет количества идет по идентификатору этого ящика.
Спасибо за ответ! Лучше бы конечно яндекс ящик оставили, потому что подписку оформила, а все равно граватар тут не нужен у вас (он на ящик гугла заточен). Почту @gmail.com я не люблю — месяц уже не открываю ее там письма теряются. Так что ответов я не получу :(
С подключением противоспам кода (тот что за 3 минуты) все получилось отлично — ни в корзине, ни в спаме пока ничего не было, акисмет и прочее даже удалила.
Подсчет комментариев тоже работает :) Это приятно!
За 2 недели жизни ваши коды самое приятное что произошло. Спасибо большое!!!
А вот этот ответ озадачил "3. Нет. Что мешает нарисовать свой вариант?" — я не помню чего такого могла спросить, что такой ответ... Помню писала (в письме наверное) про "лифт" — так я ж чайник — не смогу просто — и мало кто может даже ;) Кстати, только что заметила кнопку лифта, по-моему, ее в прошлый раз не было (или может быть такое что в другом браузере не не видно? — заходила с другого браузера тогда).
Ладно, не проблема, сменил ящик на @yandex.ru :)
Рад слышать, что все работает как надо, значит я не зря старался!
Про ответ нарисовать самому, это я накосячил немного, это не вы писали, а ответил вам. В итоге удалил и вопрос и свой ответ.
Лифт у меня появился, как видите, после вашего письма сразу же и сделал. Действительно удобно оказалось, спасибо за совет!
Да, все отлично работает. очень надеюсь что те плагин назад ставить не прийдется. Спасибо Александр! Так можно надеяться на рабочий код "лифта"? ;) В разных браузерах у меня ваш лифт отображается по-разному. Сейчас я в яндекс,интернете и вижу надпись еле заметную "наверх" слева, а в прошлый раз заходила с другого и видела справа довольно таки различимую КНОПКУ. Интересно почему так по-разному смотрится? Очень хотелось бы конечно двухсторонний лифт. вверх и вниз :)
Возможно заходили в тот момент, когда я только внедрял код и экспериментировал.
Насколько я понял вы хотите, чтобы я поделился кодом? Вообще я этого не планировал :) Но могу сказать, что часть кода я стырил у яндекса, а часть кода еще где-то стырил. Так что у меня такой вот код-мутант получился :)
Если вам хочется, то вы можете поступить еще проще — честно стырить код у меня.
Спасибо за честное предложение :) Я такой чайник еще, что не умею коды подсматривать. Искала где у меня библиотека джулери подключена или нет и не смогла — код внизу открыла, а прокрутка как-то работает неинтересно, вот если бы как в блокноте можно было открыть и поиском воспользоваться — может быть так и можно сделать, но я ж чайник :) но когда нахожу толковый материал, то довольно быстро внедряю к себе... т.е. не совсем пропащая, я думаю :)
Здравствуйте! Все сделал как написано в статье, только адрес к файлу получился другой (/public_html/wp-content/plugins/contactable/contactable.css). И в итоге ничего ( форма обратной связи не выводится). Так как я создаю первый сайт, ну вообще не знаю в чём может быть дело) подскажите пожалуйста
Неправильный путь к файлу значит указали.
Спасибо, толково
может и есть уже такой вопрос-ответ, но всё же
после того как юзер попользовался формой, письмо отправил, кроме как перезагрузка страницы можно её снова вызвать? как?
можете залить файл feeback.png, где указано "Написать письмо" Обратная связь" или в этом роде. Спасибо
Нет, нельзя — только перезагрузка страницы.
Картинки залить не могу, у меня их нет, а специально их делать нет желания.
А можно сделать, что бы отправленые письма приходили на два емайла?
Попробуйте продублировать строку
mail('admin@site.ru', $subject, $contactMessage, $headers);, указав второй e-mail в ней.не работает, такой сценарий. тоесть на первый приходит, а второй нет.
Отличная форма обратной связи! На сайт с голым HTML отлично стала. Работает безупречно! Рекомендую!
И я выше рекомендовал форму, у автора есть ещё поделки? Интерисует счётчики на сайт: посещения, скачивание, гостевая книга.
Подобного в сети полно, толковое как форма есть?
Установите себе на сайт счетчики Яндекс Метрика и Google Analytics и будет счастье.
А причем тут гостевая книга я не понимаю...
Было бы прикольно иметь такую выдвижную форму для сохранения в соц сетях. Выдвигается, а там несколько кнопок на соц сети.
Я тоже такую формочку хочу сбоку и удалить нафик плагин шаребуттонс, там фэйсбук перестал работать — он глючный вообщем. Подобные формы в действии видела, но кнопок там было максимум 4 — это очень мало и конечно никаких секретов по их установке не было, просто у людей есть такие "закладочки" уже. Где берут не знаю.
Установите себе скрипт от Димы Димокса — http://share42.com/ru
В связи с тем, что у меня возникли проблемы с отображением картинки вызывающей форму на 19" и 24" дюймовых мониторах
подскажите каким ещё образом можно вызывать форму?
В этой форме в css есть
#contactable #contactable_inner {
background-image:url (feedback.png);
...
щёлкая по картинке появляется форма обратной связи, хотелось бы отказаться и трансформировать вызов это формы сюда:
<p id="selectorClassa7">воспользоваться формой обратной связи</p>
что тут надо добавить\изменить?, спасибо
Вот вариант для вызова формы по клику на ссылку — http://alaev.info/blog/post/2681#comment-8375
увы, с первого раза не получилось
<p id="selectorClassa6">Чтобы написать мне письмо можно:</p>
<p id="selectorClassa7">воспользоваться <a href="" title="Вызвать форму обратной связи" onClick="$('contactable_inner').click (); return false;">формой обратной связи</a></p>
Что не так?
Вот так надо делать:
<code><a onclick="$('#contactable_inner').click (); return false;" href="">формой обратной связи</a></code>
Большое спасибо!
А как сделать так чтобы после отправки сообщения, диалоговое окно вернулось на исходное, а не вообще пропало, естественно с обнулением формы?
Никак, уже не раз об этом говорили.
сейчас заметил, форму вызвал, передумал — убрал от неё осталась малозаметная полоска по вертикали на странице
можно избавиться?
натыкаюсь на ситуацию — письмо не отправляет говорит ошибка
много раз подряд??? что может быть???
сегодня та же история — говорит ошибка
но письмо отправляет, в принципе так и вчера было, говорило об ошибке всегда, пару раз отправило, потом бойкот
Ребят, все супер, но что там с выпадающим списком? Необязательно в теме (лично для меня). В тело бы письма...
Привет лучшему блогу! :)
Постоянно читаю и учусь у вас. А сейчас пришел попросить подсказку.
Довольно давно (думаю с полгода)установил себе на сайт такую форму, и она прекрасно работает, но недавно выяснилось что при регистрации нового пользователя и проверке введенного имени на незанятость, выдается сообщение "имя пользователя не может быть пустым!", позже выяснилось что удаляя строку:
[code]<script type="text/javascript" src="/engine/modules/contactable/jquery.validate.min.js"></script>[/code] из main.tpl, форма регистрации работает нормально, но форма обр.связи перестает.
ДЛЕ-9.4, levsha.org, подскажите ка можно исправить ситуацию.
О как! Интересно девки пляшут! Видимо CMS использует аналогичный скрипт валидации...
Я так понял, речь идет о движке DLE, если да, то читай дальше.
Можно попробовать заключить код в теги [not-aviable=registration] и [/not-aviable] вот так:
[not-aviable=registration]<script type="text/javascript" src="/engine/modules/contactable/jquery.validate.min.js"></script>[/not-aviable]Спасибо, АлаичЪ! Да, движок ДЛЕ, но не помог тег [not-aviable], попрежнему ругается как будто форма "логин" не заполнена.
Выкрутился иначе, удалил из main.tpl отрывок кода:
<!--start contactable js --> ... <!--end contactable js -->И вставил его в fullstory.tpl и shortstory.tpl, теперь форма обратной связи работает на главной, категориях и полных новостях.
Это, конечно, не правильно, поэтому если ктото найдет корень проблемы — буду признателен.
Друзья, очень понравилась форма — СУПЕР! Всё работает!
Но не смог найти ответ на вопрос от 16.04.2012 в 12:20 : "... как эту форму вставить в хтмл код сайта? Тоесть у меня все получилось с выдвижной формой, а мне дополнительно нужно ее вставить в страницу сайта. Чтобы она находилась в статическом виде..."
Это возможно реализовать?
Как это «у меня все получилось с выдвижной формой», вяжется с этим «нужно ее вставить в страницу сайта»?
Эндрю, эту замечательную форму хочу использовать только на странице «Контакты» и в статичном виде в середине страницы! Весь день потратил и не смог самостоятельно разобраться, где настроить эти параметры!
Я так понял, что хотите в двух местах, а сделали только в одном. Так во втором месте точно также.
Спасибо Эндрю за развёрнутый ответ! Вопрос лишь в том, что нужно поменять в коде, чтобы форма обратной связи была изначально открыта и располагалась в центре страницы?
Дошло. Сорри, я не знаю :(
Идем в админке во «Внешний вид» -> «Редактор», выбираем файл header.php, находим там </head> и ВЫШЕ вставляем:
Александр, а если нет такого тега </head> ни открывающего, ни закрывающего, т очто делать? у меня вот как там вообще есть например: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
это начало кода, но видим, что что-то похожее заключается вот так: <head profile="http://gmpg.org/xfn/11">
И есть скрипт который не заключен в теги, я попробовала первым вариантом вставить скрипт без тегов — не помогло и во втором случает это скрипт в любое место кода с тегами вот так: <head><script type="text/javascript">$(document).ready (function (){$('#contactable').contactable ();});</script></head>
а вставила например между таких строк: <?php wp_enqueue_script ('jquery');?>
<head><script type="text/javascript">$(document).ready (function (){$('#contactable').contactable ();});</script></head>
<?php wp_head (); ?>
<script type='text/javascript' src='<?php bloginfo ("template_directory");?>/letter-frame-templatelite.com.js'></script>
Путь файла, который меняли в jquery.contactable.js у меня так прописала: http://uvlekatelnie-bonsai.ru/wp-content/plugins/contactable/mail.php — когда забиваю для проверки эту строчку в браузер, то выскакивает надпись: success
Я так понимаю с адресом значит все в порядке -здесь не ошиблась. С хедером получается ошибка? что нет тегов таких?
Не отобразилась формочка вообщем.
а в functions.php один за другим 2 перечисленных кода вставила перед закрывающим ?> Это вроде правильно сделала.
Подскажете мне что с кодом моим сделать куда что вставить в хедере? Так то все верно проделала.
Если в header.php нет закрывающего </head>, значит надо искать его в дургом месте. Импровизировать тут нельзя и тем более самостоятельно прописывать <head>. Поищите в других файлах шаблона и вставьте туда, все будет работать.
Проверила все свои файлы шаблона темы -нет этого <head> ни в одном :( Слово head встречается только в таком виде:
<head profile="http://gmpg.org/xfn/11">
<?php wp_head (); ?>
без закрывающего тега.
В хтмл учебниках пишут что закрывающий тег якобы необязателен или не везде обязателен. Просто расстройство какое-то — у всех нормально все, а у меня он осутствует :(
Значит надо срочно создать закрывающий </head> перед <body>. А дальше все по инструкции.
Пробовала и так. И по первому варианту даже уже попробовала. Не выходит "каменный цветок" :(
Все, я устал, нет у меня больше идей =) Обратитесь к кому-нибудь, кто согласится разбираться с ситуацией...
Да нет у меня никаких претензий. Очень своим шаблоном недовольна. Кто бы научил меня дизайн моего шаблона натянуть на F2 например. Пробовала, но пока не уразумела — сомневаюсь что это реально. Надо садится и учить все коды и фотошоп :(
Еще вопрос не может ли установленная форма Контакт 7 (плагин) мешать появлению этой формочки обратной связи? Может плагин вмешивается и потому не видно? и еще немного запуталась в части 1 — это ко всем остальным сайтам, которые не на вордпрессе? там что-то по-поводу отключения библиотеки джеклювери написано, если она стоит уже.
> может ли установленная форма Контакт 7 (плагин) мешать появлению этой формочки обратной связи?
Отключите ее — сразу будет понятно.
> запуталась в части 1 — это ко всем остальным сайтам, которые не на вордпрессе?
Да, к любым сайтам.
> запуталась в части 1 — это ко всем остальным сайтам, которые не на вордпрессе?
Да, к любым сайтам.
Можно ли к вордпрессу попробовать применить? Может ему первый вариант больше по душе прийдется?
Попробуй, но оба варианта идентичны по сути. Но чем черт не шутит...
Здравствуйте. Установил ваш скрипт на сайт... в мозилле и в хроме все норм... а в IE9 почему-то кнопка прячется за флешем... подскажите, пожалуйста, как исправить ситуацию? Заранее спасибо!
Прочитайте это дело — http://habrahabr.ru/post/50334/
Visyo sdelal kak nado. no email ne otpravlayaet. dazhe ustanovil jquery-1.8.2.min.js ... no ne polucaetsa
Спасибо, прикрутил форму на сайт Opencart. Очень удобно
Пробовал поставить на wordpress. Вторым способом не получилось. Форма не появилась. Пробовал первым. Форма появляется, но она кривая. Нету кнопки отправить письмо. Плюс еще перекосилось верхнее меню на mootools. А именно подменю, которое должно вылетать при наведении мышки не показываетя, а отображается рядом. Думал, проблема в этой строке <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js?ver=1.7.1"></script>
После удаление меню пришло в норму, но форма снова исчезла.
Шаблон Praven. Кто-нибудь сталкивался с такой проблемой? Есть варианты её решения?
Спасибо большое за форму! С выезжающей панелькой всё получилось. Но мне надо дополнительно сделать вызов формы из текста новости (движок DLE 9.5). Делала, как указано выше в комментариях <a onclick="$('#contactable_inner').click (); return false;">Оформить заявку</a>, ссылка появляется, но она не кликабельна.
Подскажите, плиз, что надо прописать, чтобы открывалась форма. Если href, то какую ссылку там указывать.
Спасибо.
Попробуйте так <a href="#" onclick="$('#contactable_inner').click (); return false;">Оформить заявку</a>
Попробуйте так <a href="#" onclick="$('#contactable_inner').click (); return false;">Оформить заявку</a>
Увы, если ставлю так, то при нажатии на ссылку просто срабатывает скролл вверх страницы.
Спасибо! прикольная форма. А у меня сайт на php. Как сделать, чтобы форма была на всех страницах? Просто теги боди и head у меня только на отдельных страницах, а хэдэр, футер и левый блок одни и те же. Это мне сейчас на всех страницах впихивать код? Может можно как то иначе?
Блин, запутался... АлаичЪ, ваш специалист может мне помочь за 500 рубликов? Хочу чтобы не вставлять код на все страницы.
Не знаю, как и что у вас там реализовано, но чтобы форма была на всех страницах, надо чтобы на всех страницах был и код, а вот как и куда его запилить надо, это уже отдельный разговор.
Специалист, не специалист, но код в любом случае придется вставлять на все страницы. Иначе переделывать сайт надо, а это уже не 500р. Напишите мне в feedback, я дам контакт программиста, там уже сами решите что к чему.
куда написать?.. ну он лайн консультанты же делают как то, чтобы он на всех страницах отображался?
Что то у меня не отображается :( Вроде все сделал по инструкции
Здравствуйте.
Установил на DLE 9.7 и настроил "под себя" за пару часов (сама установка заняла не более 10 мин.) все работает замечательно... за исключением того, что посетители теперь не могут зарегистрироваться :) постоянно сообщается, что данное (любое) имя уже зарегистрировано...
Жаль конечно, но придется отказаться от данной формы.
В любом случае — благодарю Вас за полезные статьи, модули и прочие полезности :)
А как сделать так чтоб поле было необязательным для заполнения?
"Форма обратной связи с капчей уже не рулит, потому что данный скрипт работает только при включенном javascript, а у ботов он выключен, соответственно пользователям никакую капчу вводить не придется, а у вас не будет спама."
А зачем вообще он нужен JS, что без него "левую" форму отослать нельзя? Юмористы ))