Установка виджета бронирования для гостей RESTOPLACE на сайт — общий принцип
В этой инструкции вы узнаете, как установить HTML-код виджета бронирования Restoplace на Ваш сайт всего за несколько минут
ВАЖНО: Рекомендуем устанавливать виджет на сайт, когда уже созданы и заполнены столы, создана схема зала, настроены условия работы и депозиты, оформлен дизайн виджета, а ваши сотрудники обучились работе с книгой резервов Restoplace
Как установить виджет бронирования Restoplace на свой сайт, с плавающей кнопкой
Войдите в административную панель RESTOPLACE, нажмите «виджет для сайта», скопируйте HTML-код виджета
Войдите в административную панель управления Вашего сайта и вставьте скопированный HTML-код перед закрывающем тегом </body> на те страницы Вашего сайта, куда вы хотите подключить систему. Чаще всего (но не всегда) код нужно вставлять в «шаблон» сайта. Код устанавливается точно так же, как и счётчики посещаемости (Google Analytics, LiveInternet, Яндекс. Метрика).
Если всё сделано правильно, на всех страницах вашего сайта появится плавающая кнопка «Забронировать стол» (её стиль и расположение можно настроить в редакторе дизайна виджета), нажав на которую, в всплывающем окне откроется ваш виджет бронирования Restoplace и ваши гости смогут самостоятельно подобрать и забронировать понравившийся столик онлайн.
Если всё сделано правильно, на всех страницах вашего сайта появится плавающая кнопка «Забронировать стол» (её стиль и расположение можно настроить в редакторе дизайна виджета), нажав на которую, в всплывающем окне откроется ваш виджет бронирования Restoplace и ваши гости смогут самостоятельно подобрать и забронировать понравившийся столик онлайн.
Инструкции по установке виджета на популярные CMS
Для распространённых систем управления сайтами (CMS) мы подготовили пошаговые инструкции:
Установка виджета RESTOPLACE на ваш сайт на CMS 1C-Bitrix
Установка виджета RESTOPLACE на ваш сайт на CMS NetCat
Установка виджета RESTOPLACE на ваш сайт на CMS WordPress
Установка виджета RESTOPLACE на ваш сайт на CMS MODx
Установка виджета RESTOPLACE на ваш сайт на конструкторе Tilda
Установка виджета RESTOPLACE на ваш сайт на CMS InSales
Установка виджета RESTOPLACE на ваш сайт на UMI. CMS
Открытие виджета по своей кнопке на сайте
Виджет бронирования Restoplace, так же может открываться при клике по любой кнопке на вашем сайте:
СПОСОБ № 1 (ОТКРЫТИЕ ВИДЖЕТА В НОВОЙ ВКЛАДКЕ)
Просто скопировать ссылку вашего виджета Restoplace и установить на вашей кнопке. Виджет будет открываться в новой вкладке. UTM-метки передаваться не будут
СПОСОБ № 1 (ОТКРЫТИЕ ВИДЖЕТА В НОВОЙ ВКЛАДКЕ)
Просто скопировать ссылку вашего виджета Restoplace и установить на вашей кнопке. Виджет будет открываться в новой вкладке. UTM-метки передаваться не будут
Нажмите на кнопку, откроется пример
виджета Restoplace в новой вкладке
виджета Restoplace в новой вкладке
СПОСОБ № 2 (ОТКРЫТИЕ ВИДЖЕТА В ВСПЛЫВАЮЩЕМ ОКНЕ)
1. Установить скрипт виджета Restoplace на вашем сайте. Инструкция выше
2. Добавьте класс «restoplace-click-open» любым кнопкам на вашем сайте, при клике на которые должен открываться виджет бронирования Restoplace
3. Чтобы скрыть нашу плавающую кнопку, вам нужно прописать CSS стили:
#restoplace-wrapper-btn { display: none; }
1. Установить скрипт виджета Restoplace на вашем сайте. Инструкция выше
2. Добавьте класс «restoplace-click-open» любым кнопкам на вашем сайте, при клике на которые должен открываться виджет бронирования Restoplace
3. Чтобы скрыть нашу плавающую кнопку, вам нужно прописать CSS стили:
#restoplace-wrapper-btn { display: none; }
ЗАБРОНИРОВАТЬ СТОЛИК
Нажмите на кнопку, откроется пример
виджета Restoplace в всплывающем окне
виджета Restoplace в всплывающем окне
Как вставить виджет бронирования в тело сайта
Виджет Restoplace можно встроить прямо в тело сайта, следуйте инструкции:
1. Перейдите в книгу резервов адреса — нажмите на адрес на главном экране админки Restoplace
1. Перейдите в книгу резервов адреса — нажмите на адрес на главном экране админки Restoplace
2. В правом верхнем углу нажмите кнопку «Настройки», откроется окно настроек адреса
3. В открывшейся вкладке «Информация», в самом низу, скопируйте «Хэш адреса»
4. Замените хэш адреса выделенный зелёным на скопированный, в этом Html-коде
<iframe src="https://www.restoplace.ws/?address=daf488cc967e0a5d37f6" frameborder="0" style="width: 100%; height: 700px;"></iframe>
5. Установите этот Html-код c вашим хэш-адресом на свой сайт, в любой блок в теле сайта
<iframe src="https://www.restoplace.ws/?address=daf488cc967e0a5d37f6" frameborder="0" style="width: 100%; height: 700px;"></iframe>
5. Установите этот Html-код c вашим хэш-адресом на свой сайт, в любой блок в теле сайта
Пример виджета Restoplace, установленного в тело сайта:
Важная информация
Если у Вас возникают трудности с установкой — мы рекомендуем обратиться к специалисту, который сможет грамотно и подробно объяснить необходимые действия или самостоятельно установить код на сайт.
ВАЖНО: Для установки Restoplace на другой сайт не надо регистрироваться заново — достаточно установить этот же код на другой сайт.
После внесения каких либо изменений в административной панели Restoplace (изменение столов, схемы зала, дизайна виджета) НЕ нужно обновлять код на сайте, изменения применятся автоматически.
Не забудьте включить адреса (после добавление столов и всех настроек) чтобы они появились в установленном виджете
Прочитайте ещё
Пошаговое руководство по установке виджета бронирования RESTOPLACE в группу вашего заведения в Вконтакте
Где включаются и настраиваются депозиты? Как задать размеры депозитов и добавить исключения?
Как изменить цветовое оформление виджета для гостей, который устанавливается на вашем сайте и в соцсетях
Пошаговое руководство по установке виджета бронирования RESTOPLACE в Inst-m вашего заведения
Как произвести интеграцию UDS с Restoplace. Как настроить UDS