Центр поддержки клиентов:
8 (800) 505 04 75
Ссылка на сайт

Установка онлайн-записи на сайт (произвольная кнопка)

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

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

Пример:

_____________.png

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

<a href="#" class="ms_booking">Записаться онлайн</a>

Установка кнопки

В основном меню перейдите в раздел Онлайн-запись – Вебсайт. Выберите нужную форму или добавьте новую (как это сделать, читайте в статье Создание виджетов онлайн-записи).

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

_______________________.png

Перейдите во вкладку Код кнопки. Скопируйте код кнопки и установите перед закрывающимся тегом </body> на каждой странице сайта. 

Код имеет следующий вид:

<script type="text/javascript" src="https://w11782.yclients.com/widgetJS" charset="UTF-8"></script>

где 11782 - уникальный идентификатор конкретной формы.

Однако, в данный код необходимо внести некоторые изменения. Уберите из него https: и поставьте на сайт получившийся вариант кода.

В данном случае:

<script type="text/javascript" src="//w11782.yclients.com/widgetJS" charset="UTF-8"></script>

 

Идентификатор для конкретной формы также можно получить на странице Онлайн-запись  – Вебсайт (подробнее об этом в статье Как узнать номер (ID) формы онлайн-записи (виджета)). В шаблоне сайта код формы записи должен располагаться под кодом кнопки.

Была ли эта статья полезной?
Пользователи, считающие этот материал полезным: 7 из 10
Еще есть вопросы? Отправить запрос

Комментарии

  • Avatar
    Ирина

    а теперь можно привести пример как внутри кнопки button или a должен быть этот код?

  • Avatar
    Ольга Тележенко

    Здравствуйте, Ирина.
    Сначала ставим код кнопки, после него код виджета.
    Выглядеть это должно примерно так:
    .<a class="ms_booking" href="#">Записаться</a>
    <script type="text/javascript" src="//w11111.yclients.com/widgetJS" charset="UTF-8"></script></button>

    где w11111 - уникальный идентификатор конкретной формы.
    Его можно найти в разделе Онлайн-запись - Вебсайт - столбец Ссылка.

    Изменено: Ольга Тележенко
  • Avatar
    Влад Бриштель

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

  • Avatar
    Влад Бриштель
  • Avatar
    Полина Попова

    Влад, ответила вам в статье по ссылке: https://support.yclients.com/hc/ru/articles/115002185533

    Спасибо за информацию по API. С Tilda есть готовая интеграция, но в этом случае кнопку изменить нельзя. На всякий случай ссылка на инструкцию от Tilda:
    http://help-ru.tilda.ws/online-booking

    Для того чтобы добавить онлайн-запись на кнопки в CMS Tilda, Вам необходимо использовать блок Tilda "Вставка HTML кода" из раздела готовых блоков "Другое".

    Чтобы настроить открытие формы на собственную кнопку, то инструкция также вот:
    1. В данный блок вставьте нижеследующий код:

    $(document).ready(function() {
    $('a.tn-atom').addClass('ms_booking');
    var scriptService = document.createElement('script');
    scriptService .src = "https://wXXXXX.yclients.com/widgetJS";
    scriptService .type = "text/javascript";
    scriptService .charset = "UTF-8";
    document.documentElement.appendChild(scriptService );
    });

    2. Необходимо заменить wXXXXX на номер Вашего виджета
    3. После того как Вы добавите вышеописанный код, необходимо изменить тип кнопки. Для этого перейдите к блоку с кнопкой и нажмите "Редактировать блок". На открывшейся странице дважды кликните по кнопке онлайн-записи и нажмите кнопку "Настройки" в нижнем правом углу. В меню настроек измените следующие поля (Значение полей представлено в кавычках):
    - LINK - "#";
    - Target - "Same Window".

    Напишите, пожалуйста, получилось ли настроить?