Центр поддержки клиентов:
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 из 11
Еще есть вопросы? Отправить запрос

Комментарии

  • 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".

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

  • Avatar
    Дмитрий

    А как добавить произвольную кнопку на wix сайты? Какой код должен исполняться внутри метода onClick у кнопки?

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

    Здравствуйте, Дмитрий. Более подробная инструкция о том, как установить кнопку онлайн-записи на сайт с CMS Wix есть по ссылке: https://support.yclients.com/hc/ru/articles/214419565
    Если возникнут трудности с установкой кнопки, Вы всегда можете написать нам на support@yclients.com

  • Avatar
    Дмитрий

    Ольга, в статье которую вы указали описывается как создать страницу с онлайн записью в wix. Меня интересует именно ваш виджет, который выплывает поверх страницы как в этой статье https://support.yclients.com/hc/ru/articles/203046042 только по нажатию на произвольную кнопку

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

    Дмитрий, отправила Вам на почту инструкцию по установке кнопки-онлайн записи в Wix.Если возникнут трудности с установкой - обращайтесь!

  • Avatar
    Дмитрий

    Ольга, а можете так же и мне скинуть данную инструкцию? Чтобы именно по кнопке WIX открывался виджетю Возможно вообще такое?

  • Avatar
    Полина Попова

    Дмитрий, отправили вам инструкцию. Да, так настроить открытие формы на сайте WIX можно.

  • Avatar
    Дмитрий

    Спасибо. Конечно, все выглядит "топорно"... :)
    То есть сделать так, чтобы выплывало окно виджета, а не открывалось в новой странице, как по кнопке "онлайн запись" от уайклаентс, нельзя?

  • Avatar
    Полина Попова

    Можно сделать так, чтобы окно виджета открывалось на сайте. Пример сайта пришлю вам на почту.

    Настроить это можно по инструкции, которую я прислала ранее.

  • Avatar
    Дмитрий

    Мы немного о разном говорим? :) Я имею ввиду, возможно ли сделать на wix точно так же как тут - https://boycut.ru/msk/ в разделе "цены и услуги", нажимаешь на кнопку услуги - справа выплывает виджет?

  • Avatar
    Полина Попова

    Поняла вас, Дмитрий.

    Если вам нужна кнопка не YCLIENTS, а WIX + встроенный виджет на сайте, то, к сожалению, не получится соблюсти оба условия.

    Либо кнопка YCLIENTS + встроенный виджет, либо кнопка WIX + открытие формы в отдельной странице, либо кнопка WIX + открытие отдельной страницы, где через iframe добавлена форма YCLIENTS. Наиболее симпатичный пример последней реализации вышлю вам на почту.

  • Avatar
    Елена

    Доброе время суток. Пришлите пожалуйста на почту инструкцию по установке кнопки-онлайн записи в Wix.

  • Avatar
    Mark

    Подскажите, а зачем вставлять скрипт прямо в кнопку, если он не сработает? Ведь именно класс - ms_booking тут важен? Или я чего недопонимаю?

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

    И подскажите, как сделать 2 кнопки, что бы они открывали 2 разных виджета на одной странице?
    w11111.yclients.com/widgetJS
    w22222.yclients.com/widgetJS

    Изменено: Mark
  • Avatar
    Полина Попова

    Добрый день, Елена.

    Инструкция по ссылке:
    https://support.yclients.com/hc/ru/articles/214419565

  • Avatar
    Полина Попова

    Марк, class ms_booking позволяет открывать форму как встроенный виджет YCLIENTS на сайте.

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

    Чтобы на одну страницу сайта добавить 2 кнопки с 2 разными виджетами, воспользуйтесь статьей по ссылке:
    https://support.yclients.com/hc/ru/articles/208613345

    Изменено: Полина Попова