Вбудувати

Як це налаштувати

1. У панелі wp-admin вашого сайту перейдіть до Baza Booking Calendar – Налаштування – Вбудовування, поставте галочку біля пункту «Дозволити вбудовування на інших сайтах» і збережіть зміни.
2. На цьому ж екрані введіть у полі «Сайти, яким дозволено вбудовувати» сайти, які можуть вбудовувати календар, по одному в кожному рядку, вказуючи лише домен: example.com Залиште це поле порожнім, і будь-який сайт зможе вбудувати календар – це також означає, що будь-який сайт зможе розмістити його під своїм власним контентом.
3. Виберіть, що потрібно вбудувати на цьому ж екрані, і скопіюйте рядок, який система сформує для вас. Або скористайтеся одним із наведених нижче прикладів – це те саме, тільки вже заповнене.
4. Вставте його на інший сайт у будь-якому місці сторінки, де має розміщуватися календар. Там не потрібно нічого встановлювати: ні плагінів, ні WordPress, ні облікового запису.

Приклади

Повний календар із вибором послуг

<script src="https://bazadevelopers.com/bbc-embed.js"></script>

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

Один сервіс окремо

<script src="https://bazadevelopers.com/bbc-embed.js" data-service="12"></script>

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

Кнопка «Увійти» для їхнього заголовка

<script src="https://bazadevelopers.com/bbc-embed.js" data-type="auth" data-account-url="/account/" data-login-text="Log in" data-account-text="My account"></script>

Вона відображається у вигляді розмітки, а не у вигляді фрейму, тому її меню відкривається поверх сторінки. data-account-url – це сторінка на ЇХНЬОМУ сайті, на якій розміщений обліковий запис; кожне посилання в меню веде саме на неї, тому ніхто не перенаправляється на ваш сайт.

Обліковий запис клієнта – на окремій сторінці

<script src="https://bazadevelopers.com/bbc-embed.js" data-type="account" data-account-url="/account/"></script>

Розмістіть це на сторінці, яку ви вказали в атрибуті data-account-url. Бронювання, баланс, програма лояльності та профіль – усе це. Вхід та вихід із системи відбуваються на цій сторінці, і користувач ніколи її не залишає.

Куди потрапляє клієнт після здійснення оплати

<script src="https://bazadevelopers.com/bbc-embed.js" data-return-url="/thank-you/" data-cancel-url="/booking/"></script>

Зазначено в календарі. Обидві адреси мають бути на одному з перелічених вище сайтів – платіж ніколи не надсилається назад на адресу, за яку ніхто не поручився.

Квитанція на сторінці, на яку вони потрапляють

<script src="https://bazadevelopers.com/bbc-embed.js" data-type="payment" data-home-url="/"></script>

Розмістіть це на сторінці, назва якої вказана в атрибуті data-return-url. Тут відображаються дані про замовлення, дати та суму оплати – платіжний шлюз додає номер бронювання до адреси, і ця функція зчитує його. Атрибут data-home-url вказує на сторінку, на яку веде відповідна кнопка на їхньому сайті.

Скільки місця це займає

<script src="https://bazadevelopers.com/bbc-embed.js" data-width="100%" data-max-width="1200px"></script>

Число вказує кількість пікселів; все інше сприймається так, як написано. Якщо це значення не вказано, елемент займає весь простір, відведений йому на сторінці.

Інший вигляд, відмінний від ваших власних сторінок

<script src="https://bazadevelopers.com/bbc-embed.js" data-theme="dark" data-view="month" data-whole-day="yes"></script>

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

Коли конструктор сторінок не зберігає тег скрипта

<div data-bbc-embed data-service="12"></div> <script src="https://bazadevelopers.com/bbc-embed.js"></script>

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

Кешування

Якщо на вашому сайті використовується плагін кешування сторінок (LiteSpeed Cache, WP Rocket, W3 Total Cache, WP Super Cache та інші), необхідно налаштувати три параметри, інакше форма бронювання працюватиме некоректно, що може виглядати як її помилки:

• Не надавайте кешовані сторінки відвідувачам, які увійшли в систему. Сторінка, створена для гостя, містить токени безпеки гостя, і кожен із них відхиляється, коли цю сторінку використовує користувач, що увійшов у систему.
• Не дозволяйте оптимізатору JavaScript об'єднувати або переміщувати вбудовані скрипти цього плагіна. Саме там містяться його налаштування та токени, а об'єднаний файл – це єдиний файл для всіх, тобто токен одного відвідувача передається всім іншим.
• Тривалість існування сторінки не повинна перевищувати дванадцяти годин, або ж слід виключити сторінки, що містять форму бронювання. Термін дії токена безпеки становить приблизно стільки, і сторінка, яка існує довше, ніж її власний токен, призводить до відмов.

А також очистіть кеш після внесення будь-яких змін. Плагін запитує новий токен і робить повторну спробу, коли виявляє застарілий, тому звичайного відвідувача це не зупиняє – але сторінку, сформовану для неправильної особи, неможливо виправити з браузера.

Поширені проблеми

• Нічого не відображається: наведена вище опція вимкнена, або ліцензія не передбачає вбудовування. Якщо ця опція вимкнена, цей сайт навмисно не надає жодних даних.
• Календар відображається, але щодня з’являється повідомлення про помилку: сайт, на якому він розміщений, відсутній у наведеному вище списку. Запит до сайту, якого немає у списку, обробляється без дозволу на читання відповіді, і браузер її ігнорує.
• Сесія не зберігається: обидва сайти повинні використовувати протокол HTTPS. Браузер відмовляється зберігати сесію для одного сайту, поки відвідувач перебуває на іншому, якщо обидва сайти не захищені.
• Меню облікового запису веде на цей сайт: відсутній атрибут data-account-url. Без нього система не знає, де знаходиться сторінка власного облікового запису, тому посилання залишаються такими, як вони були вказані тут.
• Два календарі на одній сторінці: на сторінку можна відобразити лише один – його налаштування є змінними, спільними для всієї сторінки. Щоб розмістити другий календар в окремій рамці, додайте атрибут data-frame="yes".
• Сторінка квитанції порожня: вона друкується лише тоді, коли шлюз перенаправив клієнта на неї, оскільки номер бронювання міститься в адресі. При ручному відкритті цієї сторінки нічого не відображається, що є нормальним.