Перед тем, как начать интегрировать 5crm в форму Вашего сайта, проверьте, что Вы поставили галочку напротив Захват Web-формы в разделе Компания — Код на сайт.
Для интеграции 5crm в форму Вашего сайта — сами формы редактировать необязательно.
Вам достаточно разместите перед закрывающим тегом </body> следующий код:
- Вместо переменной ВАШ_ТОКЕН_ДОСТУПА — подставьте значение из Панели Управления 5CRM [Компания — Код на сайт]
- Вместо переменной ‘qname’ — подставьте значение name=’ ‘ вашего строчки с вводом имени.
- Вместо переменной ‘qphone’ — подставьте значение name=’ ‘ вашего строчки с вводом телефона.
- Вместо переменной ‘qemail’ — подставьте значение name=’ ‘ вашего строчки с вводом почтового адреса.
- Вместо переменной ‘qtext’ — подставьте значение name=’ ‘ вашего строчки с вводом текста.
- Вместо переменной ‘gform_btn’ — подставьте значение class=’ ‘ вашей кнопки отправки формы.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<script charset="utf-8" src="https://api.5crm.ru/ctm/get?public_token=ВАШ_ТОКЕН_ДОСТУПА"></script> <div style="display: none; position: fixed; top: 100px; left: 0; width: 300px; opacity: .8; overflow: hidden; z-index: 99999;"> <form name="myForm" method="post" class="five_crm_form"> <input type="text" class="five_crm_form__name" name="name" value="" size="40" placeholder="Имя"> <input type="text" class="five_crm_form__email" name="email" value="" size="40" placeholder="Email"> <input type="text" class="five_crm_form__phone" name="phone" value="" size="40" placeholder="Телефон"> <input type="text" class="five_crm_form__description" name="description" value="" size="640" placeholder="Описание"> <input type="text" class="five_crm_form__sum" name="sum" value="" size="40" placeholder="Цена"> <input type="submit" class="five_crm_form__submit" value="Записаться"> </form> </div> <script> jQuery(window).on('load', function () { // захват имени jQuery("[name='qname']").keyup(function () { jQuery('.five_crm_form__name').val(jQuery("[name='qname']").val()); }); // захват телефона jQuery("[name='qphone']").keyup(function () { jQuery('.five_crm_form__phone').val(jQuery("[name='qphone']").val()); }); // захват почты jQuery("[name='qemail']").keyup(function () { jQuery('.five_crm_form__email').val(jQuery("[name='qemail']").val()); }); // захват описания jQuery("[name='qtext']").keyup(function () { jQuery('.five_crm_form__description').val('Вопрос: ' + jQuery("[name='qtext']").val()); }); // захват суммы jQuery('.gform_btn').on('click', function () { jQuery('.five_crm_form__sum').val(parseInt(jQuery("[name='qprice']").text())); }); // отправка данных в 5CRM по нажатию на кнопку с классом 'gform_btn' jQuery('.gform_btn').on('click', function () { jQuery('.five_crm_form__submit').click(); }); // отправка данных в 5CRM без перезагрузки страницы jQuery('.five_crm_form').submit(function (e) { e.preventDefault(); }); }); </script> |
Скрытая форма заполняется автоматически по мере заполнения выбранной формы на сайте.
Если потребуется отладка, вы можете снять стиль ‘display: none;’ с родительского блока <form>.
Для интеграции доступны следующие поля (значения name=’ ‘ в скрытой форме):
- name — название сделки
- email — email
- phone — телефон контакта
- sum — сумма
- description — описание.
- sum_original — себестоимость.
funnel_id — это id воронки, в которую вы хотите поместить сделку
stage_id — это id этапа этой воронки