Карти

Карта представляє або одного постачальника (наприклад, готель або провайдера вражень), або інвентар (тобто тип кімнати, конференц-зал, спа тощо), або колекцію інвентарю, таку як кураторський список або збережений пошук, і відображає ці деталі через інтерактивну карту з маркерами, які можна бронювати. Користувач може взаємодіяти з картою наступними способами:

Масштабувати, панорамувати та перетягувати карту, щоб побачити доступний інвентар.
Клікнути на маркер карти, щоб побачити деталі інвентарю у вигляді Картки.

Карта з відкритою карткою — *Карта з бронюваним інвентарем*

Далі в цій статті ми розглянемо, як створювати, налаштовувати та ділитися вашими картами.

Створення карти

Карти можна створювати двома способами:

Карта з одним маркером: Створіть карту з чогось, що ви знайшли під час пошуку.
Карта з кількома маркерами: Створіть карту з кураторського списку або збереженого пошуку.

Карта з одним маркером

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

Карта з кількома маркерами

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

Налаштування карти

Форма дозволяє налаштувати вашу карту наступними способами:

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

Після збереження карти вас перенаправить на сторінку ваших карт, і ваша карта готова до поширення.

Поширення карти

Вгорі показано зображення з усіма доступними діями для вашої карти:

Оновити Оновлює конфігурацію вашої карти.
Додати до WinkLinks Додає карту до вашого облікового запису WinkLinks.
Вбудувати Показує, як вбудувати цю карту як Карту на ваш сайт.
Використовувати з WordPress Показує, як використовувати наш плагін для WordPress для вбудовування цієї карти на ваш сайт.

Деякі з цих опцій ми розглянемо детальніше нижче.

Вбудування

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="MAP"
       id="64d7cbc8-61df-11ef-9722-42004e494300"
    ></wink-content-loader>

    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>

    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="YOUR CUSTOMIZATION ID GOES HERE"
    ></wink-app-loader>
  </body>
</html>

Ось як вбудувати вашу карту на сайт:

Рядок 3 показує, як вбудувати стилі Wink на ваш сайт.
Рядки 6–9 показують, як використовувати Web Component wink-content-loader і вказати йому завантажити рекламний банер для вашого коду.
Рядок 11 показує, як вбудувати наш Javascript на ваш сайт.
Рядок 13 показує, як вбудувати Web Component wink-app-loader і вказати йому завантажити налаштування конфігурації на рівні сторінки.

API

Розробники, які хочуть керувати картами, можуть перейти до Розробники > API > Інвентар.

Додаткове читання

Дізнайтеся більше про нашу колекцію Web Components.
Дізнайтеся більше про плагін Wink для WordPress.