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

Установка онлайн-записи на произвольную кнопку в Tilda

1. Добавьте кнопку, которая будет кнопкой для онлайн-записи и опубликуйте сайт.

Настройка обычной кнопки

В Библиотеке блоков выберите вид Форма и кнопка, добавьте Кнопку.

В Контенте блока измените название кнопки, укажите, например, Записаться. В поле Ссылка для кнопки укажите знак #. Сохраните и закройте блок.

_______1.png

Настройка кнопки из нулевого блока

Добавьте Нулевой блок, нажмите кнопку Редактировать блок, а после этого добавьте кнопку (Add Button). Настройте кнопку, для этого нажмите на нее и в открывшемся справа меню задайте все необходимые параметры: название, цвет, шрифт и т.д. В поле Link укажите знак #. Сохраните и закройте окно редактирования блока (Save -> Close).

_______2.png

2. После последнего блока добавьте блок HTML. В Контент блока добавьте следующий код, сохраните.

<script type="text/javascript">
$(document).ready(function() {
$('.CLASS').addClass('ms_booking');
var scriptService = document.createElement('script');
scriptService .src = "ссылка из меню Код кнопки";
scriptService .type = "text/javascript";
scriptService .charset = "UTF-8";
document.documentElement.appendChild(scriptService );
});
</script>

где CLASS – значение поля class из кода кнопки, ссылка из меню Код кнопки – значение из формы онлайн-записи YCLIENTS (о том, как найти эти данные, читайте ниже).

_______3.png

3. Перейдите на опубликованный сайт и нажмите правой кнопкой мыши на кнопку для онлайн-записи, выберите пункт Просмотреть код. Скопируйте содержимое поля class и вставьте вместо слова CLASS в HTML код, который вы доавили ранее (значение поля class вашей кнопки может отличаться от примера в этой инструкции).

_______4.png

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

Перейдите на вкладку Код кнопки и скопируйте ссылку (как это показано в примере ниже), вставьте ее вместо слов Ссылка из меню Код кнопки в HTML код, который добавили ранее.

Нажмите кнопку Сохранить и закрыть, опубликуйте сайт.

_______5.png

_______6.png

Примечание

Если виджет YCLIENTS будет вызываться по кнопке из главного меню (например, у блока ME403 есть возможность выводить кнопку в раскрытом меню), то значение в поле class, вероятнее всего, будет t-btn. В этом все будет работать корректно.

Но если добавить кнопку для YCLIENTS в любом zero-блоке, то значение поля class будет tn-atom. Это же значение tn-atom будет и на всех остальных кнопках и гиперссылках во всех zero-блоках. То есть, если кроме кнопки YCLIENTS в zero-блоке будет, например, кликабельный номер телефона, e-mail или другая ссылка, то по ним также будет вызываться виджет YCLIENTS, а не то, что предполагалось.

Вопрос можно решить версткой: убрать кнопки из zero-блоков и поставить сразу под ними родной блок с кнопкой BF101.

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

Комментарии

  • Avatar
    Михаил

    Совет всем, кто будет по этому алгоритму делать.

    Если вы хотите вызывать yclients по кнопке из главного меню (например у родного блока ME403 есть возможность выводить кнопку в раскрытом меню), то класс у вас скорее всего будет t-btn и все хорошо.

    Но вот если вы в любом zero-блоке сами кнопку добавите для yclients, то там класс у кнопки будет tn-atom. Беда в том, то tn-atom будет и на всех остальных кнопках и гиперссылках во всех zero-блоках. То есть если у вас кроме кнопки Yclients в zero-блоке будет, например, кликабельный номер телефона, email или еще какая ссылка, то отрабатывать они будут не как надо, а вызовом виджета Yclients.

    Я вопрос решил версткой – убрал кнопки из zero-блоков и поставил сразу под ними родной блок с кнопкой BF101.

    Всем добра :)

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

    Михаил, спасибо за такую подробную и полезную обратную связь.
    Добавим информацию в статью.