Revision as of 13:46, 22 September 2025 by Admin (talk | contribs)

Віджети для вашого веб-сайту

From SimplyBook.me


Чому варто використовувати наші віджети



Доступний відеоурок




віджет iFrame



1. Візьміть код iFrame вашої сторінки бронювання в Налаштування -> Налаштування віджетів бронювання -> Віджет iFrame -> Отримати код віджета.







2. Вставте його в HTML-код <body> вашого веб-сайту (або в будь-яке інше місце на вашій веб-платформі, призначене для вставки HTML-коду JavaScript iFrame).

Зверніть увагу! Різні конструктори/платформи веб-сайтів можуть мати різні способи додавання HTML-коду, тому спочатку слід перевірити, чи підтримує ваш веб-сайт вставку HTML-коду JavaScript.

Ось посібники для декількох популярних конструкторів веб-сайтів:
Перевірте, як віджети можуть виглядати на вашому веб-сайті



Віджети з попередньо визначеною послугою, постачальником, категорією або місцем розташування


Ця функція дозволяє генерувати код iframe спеціально для послуги, постачальника, категорії або місця, які ви маєте. Наприклад, якщо у вас є 2 послуги А і В, і ви вибрали послугу А як попередньо визначену, віджет відкриється на цій послузі, пропускаючи крок вибору послуги. Ця функція може бути корисною, якщо вам потрібно відобразити тільки певні послуги на конкретній сторінці вашого веб-сайту. Кроки для створення коду такі самі, як і вище, тільки в налаштуваннях віджета виберіть елемент, який потрібно попередньо визначити.



Віджети з попередньо визначеними даними клієнта


Тепер ви також можете створити віджет для конкретного клієнта з уже заповненими його даними.

1. Просто виберіть потрібний тип віджета в Налаштуваннях -> Налаштування віджетів бронювання, встановіть дизайн і натисніть Отримати код віджета.



2. Ви побачите спливаюче вікно з кодом, натисніть на нижню частину, щоб отримати детальну інформацію про код клієнта.
Скопіюйте основний код, додайте до нього нижню частину (до заздалегідь визначеного розділу) і замініть заздалегідь визначені ім'я клієнта, електронну адресу клієнта та номер телефону клієнта на необхідні дані клієнта.



3. Ви отримаєте такий код:

<script src="//simplybook.me/v2/widget/widget.js"></script> <script>var widget = new SimplybookWidget({"widget_type":"iframe","url":"https:\/\/companyname.simplybook.me","theme":"belle","theme_settings":{"sb_base_color":"#FF6969","body_bg_color":"#ffffff","dark_font_color":"#494949","light_font_color":"#ffffff","sb_busy":"#dad2ce","sb_available":"#d3e0f1"},"timeline":"flexible","datepicker":"top_calendar","is_rtl":false,"app_config":{"predefined": {"client": {
"name": "Mary",
"email": "mary@gmail.com",
"phone": "+1234567890"
}} }});</script>


4. В результаті детальна інформація про цього клієнта буде попередньо заповнена у віджеті, і клієнту не потрібно буде її вводити.



Віджети для входу клієнта, пакетів, членства, подарункових карток



Зверніть увагу! Наразі це працює тільки з віджетами iFrame і не працює з віджетами кнопки бронювання та кнопки контакту.


Якщо ви використовуєте одну або кілька з цих функцій, може знадобитися додати віджет, який дозволить вашим клієнтам користуватися цією опцією на вашому веб-сайті.
Це можна зробити простим способом, додавши відповідний елемент «navigate» до коду віджета:



Приклад коду віджета подарункових карток:

<script src="//simplybook.it/v2/widget/widget.js"></script> <script>var widget = new SimplybookWidget({"widget_type":"iframe","url":"https:\/\/demo.simplybook.it","navigate":"gift-card","theme":"default","theme_settings":{"timeline_show_end_time":"0","timeline_modern_display":"as_slots","sb_base_color":"#0cadef","display_item_mode":"block","booking_nav_bg_color":"#80d0f2","body_bg_color":"#f7f7f7","dark_font_color":"#494949","light_font_color":"#ffffff","btn_color_1":"#5e7da7","sb_company_label_color":"#ffffff","hide_img_mode":"0","show_sidebar":"1","sb_busy":"#dad2ce","sb_available":"#0cadef"},"timeline":"modern","datepicker":"inline_datepicker","is_rtl":false,"app_config":{"predefined":[]}});</script>

Віджет кнопки бронювання



1. Візьміть код кнопки бронювання зі сторінки бронювання в Налаштування -> Налаштування віджета бронювання -> Кнопка бронювання -> Отримати код віджета.









2. Вставте його в HTML-код <body> вашого веб-сайту (або в будь-яке інше місце на вашій веб-платформі, призначене для вставки HTML-коду JavaScript iFrame).

Зверніть увагу! Різні конструктори/платформи веб-сайтів можуть мати різні способи додавання HTML-коду, тому спочатку слід перевірити, чи підтримує ваш веб-сайт вставку HTML-коду JavaScript.

Ось посібники для декількох популярних конструкторів веб-сайтів:
Перевірте, як віджети можуть виглядати на вашому веб-сайті


Віджети з попередньо визначеною послугою, постачальником, категорією або місцем розташування.

Ця функція дозволяє генерувати код iframe спеціально для послуги, постачальника, категорії або місця розташування, які ви маєте. Наприклад, якщо у вас є 2 послуги A і B, і ви вибрали послугу A як попередньо визначену, віджет відкриється на цій послузі, пропускаючи крок вибору послуги. Ця функція може бути корисною, якщо вам потрібно відобразити тільки певні послуги на певній сторінці вашого веб-сайту. Кроки для створення коду такі самі, як і вище, тільки в налаштуваннях віджета виберіть елемент, який потрібно попередньо визначити.

Віджет кнопки бронювання та контактів



1. Увімкніть віджет контактів у розділі «Налаштування» -> «Для розробки».



2. Візьміть код кнопки бронювання зі сторінки бронювання, перейшовши до налаштувань біля цієї налаштованої функції або в налаштуваннях у меню зліва -> Налаштування віджетів бронювання -> Віджет контактів -> Отримати код віджета.







3. Вставте його в HTML-код <body> вашого веб-сайту (або в будь-яке інше місце на вашій веб-платформі, призначене для вставки HTML-коду JavaScript iFrame).

Зверніть увагу! Різні конструктори/платформи веб-сайтів можуть мати різні способи додавання HTML-коду, тому спочатку слід перевірити, чи підтримує ваш веб-сайт вставку HTML-коду JavaScript.

Ось посібники для декількох популярних конструкторів веб-сайтів:
Перевірте, як віджети можуть виглядати на вашому веб-сайті

Відгуки



Хочете додати відгуки, які ваші клієнти залишають на сторінці бронювання, на свій веб-сайт?
Просто дотримуйтесь цих інструкцій:

1. Перейдіть до Налаштування -> Налаштування віджетів бронювання -> Віджет відгуків.



2. На цій сторінці ви зможете вибрати тему, встановити кольори, визначити кількість відгуків, які ви хочете відображати, та чи хочете ви, щоб ваші клієнти могли додавати відгуки за допомогою віджета.



3. Тепер, коли дизайн налаштований, просто натисніть кнопку «Отримати код віджета», скопіюйте код і вставте його на свій веб-сайт у потрібне місце.


Вітаємо! Віджет готовий, ваші відгуки будуть опубліковані та оновлюватися на вашому веб-сайті!