Обновлено 2015-10-26

Если вам нужна инструкция по установке Callme, вы зашли по правильному адресу. В каждом посте, посвящённом скрипту обратного звонка, я писал, как именно надо его устанавливать.

В каждой версии инструкция дублировалась и кое-где изменялась. Обновлять все посты с выходами новых версий было нерационально. Поэтому я создал этот пост, в нём всегда гарантированно будет единственная и правильная инструкция по установке самой свежей версии Callme.

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

Как настроить Callme

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

  1. скачать архив (ссылка ниже)
  2. распаковать, найти файлы конфига
  3. отредактировать конфиг в соответствии с этой инструкцией. В версии 2.1 настройка содержится в двух файлах: config.js и send.php.
  4. загрузить папку callme на ваш сервер по ftp. Я рекомендую, чтобы эта папка находилась в корневом каталоге, то есть открывалась по адресу: http://....com/callme. Можно загружать и в другие каталоги, сохраняя расположение файлов внутри папки.
  5. В очень редких случаях файлы могут загружаться с неправильными правами доступа, проверьте, чтобы на папку и на файлы были права 755.
  6. добавить код для вызова в шаблон вашего сайта. Как это сделать, написано здесь, а также во множестве инструкций на форуме и в блоге.
  7. Открыть callme на вашем сайте и проверить работу. Настройка окончена.

Если что-то не получается, читайте форум и блог, пользуйтесь поиском. Обратите внимание — причины основных ошибок, которые вы могли допускать при настройке, я уже объяснил, поэтому с большой вероятностью ответ на ваш вопрос уже есть.

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

Теперь обо всём этом немного подробнее.

Настройка Callme

Самая свежая версия — 2.3, скачать.

Ваша почта, указанная для скачивания, никуда не уходит, я храню её для двух целей: привязка лицензии, когда вы её купите. И второе — могу очень редко отправить вам какое-то послание на тему новых скриптов или новых версий. Никакого спама, ничего другого.

На почту вам придёт архив с вашей копией скрипта. Его нужно распаковать и загрузить папку callme по ftp в корневой каталог вашего сайта. Начиная с версии 2.0 загружать папку со скриптом можно в любое место сайта. Главное условие — сохранять файловую структуру каталогов.

В скачанном архиве находится файл /callme/lib/send.php и открываете его в редакторе кода, не в блокноте (почему?). В соответствующем поле указываете почту получателя, на которую будет приходить уведомление о заказе.

$to = "your@mail";

Список полей для отображения хранится в файле настроек. Для того, чтобы настроить поля в форме, отредактируйте файл  callme/js/config.js.

Поля формы

ПараметрНазначениеВарианты
showButtonПоказывать ли фиксированную кнопку справа?1 да
0 нет
fieldsСписок полей для всплывающей формы. Указываются через запятую.

  • текстовое поле — не требует дополнительного кода ( ваше имя )
  • текстовый блок — ставьте перед названием минус ( -Комментарий )
  • выпадающий список — ставьте перед названием ! и разделяйте варианты для выбора таким же символом ( !Ваш вопрос!Узнать наличие!Сделать заказ )
  • чекбокс — знак вопроса перед именем ( ?Подарочная упаковка )
  • номер телефона — знак “=” перед именем поля. В поле для телефона можно ввести только цифры ( =Ваш телефон (Введите номер) )
  • если поле должно быть обязательно заполнено, после его названия добавьте звездочку ( имя* )
callTimeПоказывать время звонка?1 да
0 нет
workStart, workEndНачало и конец рабочего дня в часах, используется для выбора времени звонкаworkStart “8”
workEnd “19”
centerГде показывать форму на экране1 в центре экрана
0 у места клика
templateШаблон. С версии 2.0 hello kitty переименован в pink.default, apple, vk, fb, blackred, pink
licenseЛицензия, чтобы законно скрыть копирайт. Этот ключ можно купить здесь)00000000
showCopyrightПоказывать ли копирайт; действует только если указана лицензия1 да
0 нет

Этот код — значение по умолчанию, которое сохраняется в файле callme/js/config.js. Чтобы все работало, достаточно не трогать его. Если хотите менять значения, пользуйтесь таблицей выше. Если что-то пошло не так, скопируйте из неё код и замените им то, что получилось у вас.

var cmeData = {
// показывать кнопку справа? (1 - да, 0 - нет)
"showButton": 	"1", 

// укажите через запятую названия полей
// textarea: ставьте перед названием минус (-)
// select: ставьте перед названием "!" и разделяйте варианты для выбора таким же символом
// для поля с телефоном (input type="tel") используйте символ '='
// checkbox: знак вопроса перед именем
// если поле должно быть обязательно заполнено, после его названия добавьте * (например, имя*)
"fields": "Имя (Ваше имя), =Телефон (Укажите номер), -Вопрос (Желательно заполнить), !Ваш вопрос!Узнать наличие!Сделать заказ, ?Подарочная упаковка",

// заголовок формы
"title": "Заказать обратный звонок",

// надпись на кнопке
"button": "Перезвоните мне", 

// показывать ли время звонка (1 - да, 0 - нет)
"callTime": "1", 
"txtCallTime": "Время звонка",
"txtToday": "сегодня",
"txtTmrw": "завтра",
"txtTill": "до",
"txtHours": "час.",

"alertSending": "Идет отправка", // идет отправка
"alertSetCallTime": "Укажите время звонка", // Укажите время звонка

"mailReferrer": "Источник трафика", // откуда пришел посетитель
"mailUrl": "Страница с запросом", // страница, откуда отправлен запрос

// начало и конец рабочего дня в часах, используется для времени звонка
"workStart": "8",
"workEnd": "19",

// центрировать форму на экране? (1 - центр экрана, 0 - у места клика)
"center": "1",

// шаблон (default, apple, vk, fb, blackred, pink)
"template": "default",

// лицензия (можно купить на get.nazartokar.com)
"license": "0",
"showCopyright": "0"
}

Сохраняете файлы и загружаете их на сервер.

Обязательные поля

Для того, чтобы поле было обязательным к заполнению, после его названия нужно поставить *. Обязательными могут быть любые текстовые поля. Чекбоксы — нет. Пример:

Телефон (Укажите телефон)*

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

Настройка placeholders

Название поля может отличаться от параметра placeholder. Чтобы указать, какой текст будет использоваться в качестве placeholder, укажите его в скобках после названия поля. Этот параметр будет действовать и для текстовых полей, и для текстовых блоков (textarea).

Например: Имя(Укажите имя), -Ваш вопрос (Опишите суть вопроса)

Как открывать форму по клику на любых объектах

Чтобы форма заказа звонка отображалась по клику на чём-либо кроме кнопки справа, этому объекту нужно присвоить такой класс:

class="callme_viewform"

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

Настройка sms-уведомлений

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

Инструкция по настройке SMS

Установка кода Callme

Для работы Callme требует подключённой библиотеки jQuery версии не менее 1.4.4. Убедитесь, что у вас подключена эта версия. Если нет, подключите её таким образом:

<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>

Этот код необходимо установить до подключения скрипта. Сам скрипт подключается в одну строку:

<script type="text/javascript" charset="utf-8" src="/callme/js/callme.js"></script>

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

Обработка любых форм на странице вместо попапа

С версии 2.1 Callme умеет обрабатывать любые формы, встроенные прямо в вашу страницу. Как настроить:

  1. создаёте форму с нужными вам полями. Их количество может быть любым. Типы поддерживаемых полей — как у формы в попапе
  2. проверяете, чтобы у всех полей было указано название name="имя поля"
  3. создаёте кнопку type="button" с классом .cme-btn
  4. для того, чтобы получать уведомления, внутри формы создайте блок с классом .callme-result. В нём будут появляться сообщения об отправке. Например, “идёт отправка” или “сообщение отправлено”.

Прошу внимательно посмотреть на пример:

<form>
<input type="text" name="Ваше имя" placeholder="Укажите ваше имя">
<input type="text" name="Ваш e-mail" placeholder="Укажите вашу почту">
<button type="button" class="cme-btn">Отправить заявку</button>
<div class="callme-result"></div>
</form>

Получение атрибута ссылки

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

Что делать с версиями jQuery до 1.7 и кодировкой win-1251 (неактуально)

Начиная с версии 2.0, Callme работает со всеми версиями jQuery, не младше, чем 1.4.4 и поддерживает кодировку 1251.

Что-то не получается?

Для FAQ есть отдельный пост: возможные ошибки при установке Callme, эта запись постоянно обновляется, а свежая редакция указана над текстом.

Более подробно мы обсуждаем вопросы на нашем форуме. Читайте список вопросов и при необходимости задавайте вопросы там. Вопросы по настройке, заданные в этом посте, будут проигнорированы.

    Поширити у Фейсбуці
    Надіслати у Messenger
    Зберегти в Pocket
    Надіслати в Telegram
    Надіслати у WhatsApp

    Додати коментар

    Такий e-mail вже зареєстровано. Скористуйтеся формою входу або введіть інший.

    Ви вказали некоректні логін або пароль

    Вибачте, для коментування необхідно увійти.

    604 коментаря

    спочатку нові
    за рейтингом спочатку нові за хронологією

    Две формы на сайт.

    Возможно ли такое?

    разные поля в формах.

    Автор
    Назар Токар

    Звичайно. Читайте http://www.getcallme.com

    А чего я скачать скрипт не могу!? Нажимаю Скачать, показывается форма. Заполняю и... Ваш запрос обрабатывается... и так минут 5 висит!!!

    Вышлите скрипт на электронку, пожалуйста.

    Добрый день, спасибо за скрипт. Можно ли как-то передать заголовок страницы (title или H1), это было бы информативнее, на мой взгляд, на чем просто ссылка на страницу запроса

    Добрый вечер! Скачал бесплатную версию Callme 2,5 здесь http://dedushka.org/kod/9960.html и в архиве нет файлов config.js и send.php. Как же его настраивать?

    Автор

    Мої вітання, всі налаштування тут — http://getcallme.com/docs.html

    Спасибо за скрипт. Только один момент. Почему отправка долго идет? Пишет "Идет отправка" и секунд 10 или больше даже стоит так, да и письмо иногда быстро доходит, иногда с задержкой.

    С чем этим проблемы связаны.

    Спасибо большое! С нетерпением жду Вашего ответа.

    Автор
    Назар Токар

    Я вже писав про це, треба відключити перевірку ip-адреси. Або дочекатись нової версії.

    Спасибо за отличный скрипт!

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

    Подскажите пожалуйста как скрыть источник трафика и страницу с запросом

    Возникла такая проблема, после отправки запроса, в самом нижнем блоке появились крякозябры, а так понимаю там фраза "спасибо, вам перезвонят" или сто-то того. Они появились и в письме. Вопрос: в каком файле править кодировку?

    Здравствуйте! Спасибо огромное за такой полезный и с минимальными настройками скрипт! Скажите пожалуйста, можно ли сделать 2 формы CallMe с разными тайтлами, которые указываются в config.js?

    Автор
    Назар Токар

    На даний момент — ні.

    Извините, что опять)) Последние дни несколько раз пытался заново установить скрипт, раньше работал, но после обновления уже никогда((( уже и шаблон другой. Сразу выдает ошибку при доступе к send.php {"result": "error","cls": "c_error","time": "","message": "Ошибка"}

    Заново перезакачал, перезалил умолчания. устал уже, не понимаю, что от меня нужно. Хелп!

    .....хотя с другой стороны этот класс и нафиг не нужен. Просто вашу форму в модальное окно bootstrap запихать и всё. Будет же работать. правильно? Я щаззз вот как раз окошечко прикрутил к кнопке, у себя на сайте...осталось только ваш скрипт туда запихать.=)

    Цитата: создаёте кнопку type="button" с классом .cme-btn

    Другими словами у меня не получится создать кнопку в bootstrap с классом "btn btn-info". Придется мудрить, чтобы создать более визуально привлекательную кнопку с классом cme-btn. Да и наверное с внешним видом модального окна тоже куча заморочек будет. Средствами bootstrap никак. Почему было сразу не сделать все средствами bootstrap там же уже все встроено? Не понимаю...

    Доброе время суток! Версия 2.3 Не могу изменять обязательный поля. Привожу код из config.js

    [code]'fields' : 'Имя (Ваше имя), =Номер телефона (Ваш телефон)*, -Комментарий (Желательно заполнить)',[/code]

    Из кода выше должно быть одно обязательное поле. У меня же их 2. При чем это поля Имя и Комментарий

    Далее эксперементирую и добавляю к полю Комментарий *. Теперь при отправке пустой формы у меня одно обязательное поле - Комментарий.

    Из настроек поменял 'showButton' : '0', и в send получателя поставил.

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

    Переодически выдается ошибка

    Not Found

    The requested URL /undefinedjs/config.js was not found on this server.

    Автор
    Назар Токар

    Ставте за інструкцією.

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

    Подскажите должны ли сохраняться значения заполненных полей при повторном открытии формы?

    Телефон сохранялся если перед ним равно стояло. Сейчас я равно убрал чтобы туда можно было вводить не только цифры. И сейчас сохраняется только сообщение об отправке.

    И ещё странно ведут себя габариты попапа. Если окно большое то попап открывается нормальной ширины, а вот если размер окна браузера уменьшать то в какой то момент ширина попапа удвоится! а это явно не нужно.

    Особенно неприятно это смотрится на браузере смартфона попап расширяется почти на всё окно.

    Можно посмотреть по ссылке. Достаточно менять ширину окна браузера с открытым попапом и это будет видно.

    http://www.sportvariant.ru/callme.html

    тут чисто jquery + callme

    Автор
    Назар Токар

    На мобильных форма занимает больше места, чтобы удобнее было заполнять. После отправки форма скрывается, но в ней остаётся уведомление об отправке.

    В файле config.js строчка 248 там где идет проверка обязательных полей не учитывает поле type="tel". Поэтому при обязательном поле "Телефон" оно не будет проверятся.

    решил так:

    form.find('[type=text], textarea').each(function (){

    заменить на

    form.find('[type=text], [type=tel], textarea').each(function (){

    Файл не тот что указан, а рядом лежит callme.js.

    Спасибо за совет, поторопился не поискал внимательно.

    Открываю файл config.js нотепадомплюс - там только 53 строки?

    Callme 2.3 скачан с этого сайта. Пожалуйста подтвердите или поясните Ваш совет.

    Автор
    Назар Токар

    Да, всё верно, спасибо. В след. версии это учтено.

    Респект! Нравится! А обилие информации, инструкций и иллюстраций - бесценно!)

    Прочитал инструкцию и комментарии. Нашел несколько человек с вот такой проблемой.

    \'fields\' : \'Имя (Как к вам обращаться?)*, =Номер телефона (Ваш телефон)*,\',

    В этом случае инпут с именем обязателен для заполнения, инпут с телефоном можно и не заполнять, хотя звездочка стоит.

    Здравствуйте. Отличный скрипт. Но у меня один вопрос, для того чтобы окно скрипта более подходил под дизайн сайта, хотел бы узнать, как лучше это сделать? Менял классы, при предварительном подключении своего css, то в этом случаи сообщения уже не отправляются... А менять css каждый класс очень долго. Есть ли какой-нибудь альтернативный вариант? Спасибо.

    Автор
    Назар Токар

    Сразу уходите в бан за скрытие копирайта, батоно.

    Установил, все работает.

    Вопрос один - как вообще не выводить в окне чекбокс "Подарочная упаковка"? Мне он лишний.

    Пробовал в файле config.js удалить ?Подарочная упаковка', но тогда окно звонка вообще перестает открываться (видимо, скрипт нарушается).

    Автор
    Назар Токар

    Кавычку в конце не удаляйте.

    Спасибо! Все получилось.

    Можно ли еще воспользоваться новогодней распродажей лицензии на скрипт Callme за 4$?

    Автор
    Назар Токар

    Да, можно до конца января тем, кто прочтет это комментарий.

    Оплатил, и выслал вам заполненную форму. Буду ждать код лицензии. Спасибо.

    Назар! Поставил в октябре ваш скрипт. Все работало нормально без вопросов. Но вот на днях все перестало работать вообще. При нажатии на кнопку происходит скролл на верх страницы и все. ПОМОГИТЕ!!! Что случилось я не пойму.

    Автор
    Назар Токар

    Открыл — всё работает.

    Скрипт подружатся каждый раз при переходе по страницам и подпрыгивает возле полосы прокрутки, возможно ли как то сделать его статичным (навеяло по аналогии Загрузка статьи без перезагрузки страницы AJAX)?

    извините, не уверен что коммент добавлен пишу 2-й раз

    Автор

    @Cергей, не понял, что подпрыгивает? Callme?

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

    Установила Ваш скрипт - все работает, спасибо!

    Но:

    1) не могу сделать поле "Телефон" обязательным к заполнению (звездочка не помогает ).

    2) как добавить в поле "Телефон" возможность вставлять плюсы и скобки?

    Спасибо!

    @Юлия, та же проблема. несмотря на наличие звёздочки обязателен не только номер телефона, но и остальные поля

    сразу после редактирования полей в

    "fields": "Имя (Ваше имя), Телефон (Укажите телефон)*, -Вопрос (Желательно заполнить)*, !Ваш вопрос!Узнать наличие!Сделать заказ, ?Подарочная упаковка",

    форма справа пропадает, хотя другие параметры меняются нормально. Как убрать ненужные поля? и подскажите, пожалуйста, как вставить кнопку "заказа звонка" в хэдер около лого? спасибо!

    Назар здравствуйте! У меня вопрос (проблема) - посмотрите сайт где стоит Ваш скрипт: svn33.ru Проблемы: 1) После выбора времени звонка - он отображается "усечённо" - напополам; 2) Работа в joomla mobile - посмотрите этот сайт на андроидном смартфоне (ну не последнем, у меня HTS Desire-S), ну не в"хроме" только, в поле "Укажите Ваш вопрос", при нажатии - вообще ничего нельзя сделать. Что можно поправить? А вообще скрипт нравится, всё работает чётко. вкл. отправку смс. Не хочется оказываться!... Сайт на joomla 3x

    Александр

    Здравствуйте, Назар!

    При нажатии на кнопку, форма прячется за горизонтальное меню, форму поиска и корзину - Prestashop 1.6
    Как сделать, чтобы форма окна callme было всегда поверх любых объектов на сайте?
    Спасибо!

    Здравствуйте Назар! Подскажите, как избежать при отображении, наложения других модулей, поверх callme. (Можно увидеть на моем сайте)

    Александр

    @Дмитрий, смотрю у Вас на сайте всё нормально. Как удалось решить проблему?

    Назар, добрый день!

    Возникла трудность, не могу понять с чем! на одном моем сайте ранее установил форму, все отлично!!

    По второму ряд вопросов:

    1) появились новые папки (.git ) например - там гора всяких папок и файлов, оно реально необходимо, весит много.

    2) настроил оба файл конфига, хоть и не первый раз но по инструкции - форма появляется поля как надо все красиво. Заполняешь, жмешь отправить форма висит внизу бежит индикатор отправка, форма не закрывается - почта не приходит. Сталкивался с таким?

    Почему кнопка ЗАКРЫТЬ окно callME не работает в Google Chrome и на мобильной версии Safari и google crhome?

    На остальных браузерах все работает как надо.

    Платформа Wordpress.

    Спасибо