Maps
Карта представляет либо одного поставщика (например, отель или поставщика впечатлений), либо инвентарь (например, тип номера, конференц-зал, спа и т. д.), либо набор инвентаря, например, курируемый список или сохраненный поиск, и отображает эти данные с помощью интерактивной карты, содержащей маркеры карты для бронирования. Пользователь может взаимодействовать с картой следующими способами:
- Масштабируйте, панорамируйте и перетаскивайте карту, чтобы увидеть доступный инвентарь.
- Нажмите на маркер карты, чтобы увидеть подробную информацию об инвентаре в видеКарточка.
Оставшаяся часть статьи расскажет вам, как создавать, настраивать и делиться своими картами.
Создать карту
Заголовок раздела «Создать карту»Карты можно создавать двумя способами:
- Карта с одним маркером: Создайте карту из того, что вы нашли во времяидет поиск.
- Карта с несколькими маркерами: Создать карту изтщательно отобранный список или сохраненный поиск.
Карта с одним маркером
Заголовок раздела «Карта с одним маркером»Выше представлено изображение, взятое изПоиски показывает вам некоторые из вещей, которые вы можете сделать с результатами поиска. Одно из этих действий —Make a map
.
Нажмите на эту кнопку, и она перенаправит вас на страницу формы карты, где вы сможете начать настраивать свою карту.
Карта с несколькими маркерами
Заголовок раздела «Карта с несколькими маркерами»Оба тщательно отобранные списки и сохраненные поискиидут с действием, которое позволяет вам создать карту. Эта карта будет содержать маркеры карты для всего инвентаря в этих списках.
Настроить карту
Заголовок раздела «Настроить карту»Форма позволяет вам настроить карту следующими способами:
- Дайте карте название, чтобы вы могли запомнить, о чем она.
- Выберите, хотите ли вы, чтобы пользователю было разрешено перемещаться по карте.
- Укажите желаемую высоту карты в пикселях.
- Выберите, хотите ли вы, чтобы пользователю было разрешено увеличивать и уменьшать масштаб карты.
- Выберите стиль карты, соответствующий веб-сайту, на который вы будете ее встраивать.
- Выберите цвет маркера.
- Выберите начальную лицевую сторону карты, которую пользователи должны видеть первой. По умолчанию это родная лицевая сторона этого инвентаря.
- Вы можете добавлять собственные маркеры, круги, прямоугольники и многоугольники, чтобы обозначить другие места на карте, которые могут быть интересны вашим пользователям.
- Нажмите на
Save
кнопку, чтобы продолжить.
После сохранения карты вы будете перенаправлены на страницу ваших карт, и теперь ваша карта готова к публикации во всем мире.
Поделиться картой
Заголовок раздела «Поделиться картой»Выше показано изображение со всеми доступными действиями для вашей карты:
- ОбновлятьОбновляет конфигурацию вашей карты.
- Добавить в 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 показывают, как использоватьwink-content-loaderВеб-компонент и укажите ему загрузить рекламный баннер для вашего кода.
- В строке 11 показано, как встроить наш Javascript на ваш сайт.
- Строка 13 показывает, как встроитьwink-app-loaderВеб-компонент и укажите ему, как получить настройки конфигурации на уровне страницы.
Разработчики, желающие управлять картами, могут перейти по ссылкеРазработчики > API > Инвентарь.
Дальнейшее чтение
Заголовок раздела «Дальнейшее чтение»- Узнайте больше о нашей коллекцииВеб-компоненты.
- Узнайте больше оWink WordPress плагин.