Skip to content
Academy

Решетки

Решетката представлява списък с доставчици и наличности и показва детайлите чрез интерактивен, резервируем, решетъчен потребителски интерфейс. Решетката поддържа показване на всяка наличност от вашия куриран списък или запазено търсене. Потребителят взаимодейства с решетката по същия начин, по който взаимодейства с отделна карта с една допълнителна функция:

  1. Прелистване през решетката чрез натискане на бутона Покажи още (когато има налични още елементи).
Преглед на решетка
Решетка, показваща няколко типа стаи

По-горе е пример на нашата решетка, показваща списък с карти на типове стаи.

Останалата част от тази статия ви превежда през създаването, персонализирането и показването на решетката на вашите потребители.

Видове решетки

Section titled “Видове решетки”

Има три вида решетки:

  1. Решетка, базирана на куриран списък.
  2. Решетка, базирана на запазено търсене.
  3. Решетка, базирана на локация и критерии за сортиране (т.е. класирана решетка).

Решетка от куриран списък

Section titled “Решетка от куриран списък”

Това е решетка, която използва наличностите, които сте събрали в един от вашите курирани списъци и преобразува списъка в резервируема пътническа наличност, която можете да показвате на вашите потребители.

Създаване

Section titled “Създаване”

Навигирайте до Inventory > Curated Lists от главното меню. За този пример ще използваме вашия списък Favorites. Ако все още не сте добавили нищо към вашите Favorites, посетете Search, за да научите как.

Създаване на решетка от куриран списък
Формуляр за създаване на решетка от куриран списък
  1. Натиснете бутона Actions на списъка Favorites.
  2. Натиснете бутона Create a grid.
  3. Ще се появи нов прозорец, който ви позволява да наименувате вашата решетка. Вижте по-долу.
  4. Натиснете бутона OK, за да продължите.

Вашата решетка е създадена. Навигирайте до Tools > Grids от главното меню и кликнете върху таба Curated Grids, за да видите новата си решетка.

Персонализиране

Section titled “Персонализиране”

Формулярът ви позволява да персонализирате вашата решетка по следните начини:

  1. Дайте ѝ име, за да запомните за какво е решетката.
  2. Изберете Персонализация, която искате да приложите към тази решетка.
  3. Изберете началната страна на картата, която искате потребителите да виждат първо. По подразбиране това е оригиналната страна на тази наличност.
  4. Изберете значка, която искате да използвате на картата. Значката позволява на потребителите да сравняват наличности по агрегирана метрика като еко-приятелски.
  5. Добавете ключови думи, разделени със запетая, които ще се използват от уеб паяци.
  6. Добавете заглавия и описания на езиците, които искате потребителят да вижда.
  7. Натиснете бутона Save, за да продължите.

Споделяне

Section titled “Споделяне”
Решетка от куриран списък
Вход в решетка от куриран списък с свито меню за действия

По-горе виждате изображение с всички налични действия за вашата решетка:

  • Update Актуализира конфигурацията на вашата решетка.
  • Add to WinkLinks Добавя решетката към вашия WinkLinks акаунт.
  • Embed Показва как да вградите тази решетка като Grid във вашия уебсайт.
  • Use with WordPress Показва как да използвате нашия WordPress плъгин, за да вградите тази решетка във вашия уебсайт.

Някои от тези опции разглеждаме по-подробно по-долу.

Вграждане

Section titled “Вграждане”
<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="LIST"
       id="9a212b5e-62a7-11ef-ac3f-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 компонента wink-content-loader и да му кажете да зареди решетка за вашия код.
  • Ред 11 показва как да вградите нашия Javascript във вашия сайт.
  • Ред 13 показва как да вградите Web компонента wink-app-loader и да му кажете да зареди вашите конфигурационни предпочитания на ниво страница.

Решетка от запазено търсене

Section titled “Решетка от запазено търсене”

Това е решетка, която използва наличностите от вашето запазено търсене и преобразува резултатите от търсенето в резервируема пътническа наличност, която можете да показвате на вашите потребители.

Създаване

Section titled “Създаване”

Навигирайте до Inventory > Saved searches от главното меню. Ако все още не сте създали запазено търсене, посетете Search, за да научите как.

Създаване на решетка от запазено търсене
Формуляр за създаване на решетка от запазено търсене
  1. Натиснете бутона Actions на вашето запазено търсене.
  2. Натиснете бутона Create a grid.
  3. Ще се появи нов прозорец, който ви позволява да наименувате вашата решетка. Вижте по-долу.
  1. Натиснете бутона OK, за да продължите.

Вашата решетка е създадена. Навигирайте до Tools > Grids от главното меню и кликнете върху таба Saved Search Grids, за да видите новата си решетка.

Персонализиране

Section titled “Персонализиране”

Формулярът ви позволява да персонализирате вашата решетка по следните начини:

  1. Дайте ѝ име, за да запомните за какво е решетката.
  2. Изберете Персонализация, която искате да приложите към тази решетка.
  3. Изберете началната страна на картата, която искате потребителите да виждат първо. По подразбиране това е оригиналната страна на тази наличност.
  4. Изберете значка, която искате да използвате на картата. Значката позволява на потребителите да сравняват наличности по агрегирана метрика като еко-приятелски.
  5. Добавете ключови думи, разделени със запетая, които ще се използват от уеб паяци.
  6. Добавете заглавия и описания на езиците, които искате потребителят да вижда.
  7. Натиснете бутона Save, за да продължите.

Споделяне

Section titled “Споделяне”
Решетка от запазено търсене
Вход в решетка от запазено търсене с свито меню за действия

Вграждане

Section titled “Вграждане”
<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="LIST"
       id="be3130d5-62a7-11ef-ac3f-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 компонента wink-content-loader и да му кажете да зареди решетка за вашия код.
  • Ред 11 показва как да вградите нашия Javascript във вашия сайт.
  • Ред 13 показва как да вградите Web компонента wink-app-loader и да му кажете да зареди вашите конфигурационни предпочитания на ниво страница.

Класирана решетка

Section titled “Класирана решетка”

Създаване

Section titled “Създаване”

Създайте класирана решетка, като навигирате до Tools > Grids и кликнете върху таба Ranked Grid. Натиснете бутона Create ranked grid.

Персонализиране

Section titled “Персонализиране”

Формулярът ви позволява да персонализирате вашата класирана решетка по следните начини:

  1. Изберете дестинация. Напр. Токио.
  2. Дайте ѝ име, за да запомните за какво е решетката. Напр. Еко-приятелски хотели в Токио
  3. Изберете Персонализация, която искате да приложите към тази решетка.
  4. Изберете началната страна на картата, която искате потребителите да виждат първо. По подразбиране това е оригиналната страна на тази наличност.
  5. Изберете по каква характеристика да се сортират имотите. Напр. Еко-приятелски.
  6. Добавете ключови думи, разделени със запетая, които ще се използват от уеб паяци.
  7. Добавете заглавия и описания на езиците, които искате потребителят да вижда.
  8. Натиснете бутона Save, за да продължите.

След като запазите вашата класирана решетка, ще бъдете пренасочени към страницата с класирани решетки и вашата решетка вече е готова да бъде споделена със света.

Споделяне

Section titled “Споделяне”
Класирана решетка
Класирана решетка със свито меню за действия

По-горе виждате изображение с всички налични действия за вашата класирана решетка:

  • Update Актуализира конфигурацията на вашата решетка.
  • Add to WinkLinks Добавя класираната решетка към вашия WinkLinks акаунт.
  • Embed Показва как да вградите тази решетка като Grid във вашия уебсайт.
  • Use with WordPress Показва как да използвате нашия WordPress плъгин, за да вградите тази карта във вашия уебсайт.

Някои от тези опции разглеждаме по-подробно по-долу.

Вграждане

Section titled “Вграждане”
<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="RANKED"
       id="2483d55e-62a5-11ef-ac3f-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 компонента wink-content-loader и да му кажете да зареди класирана решетка за вашия код.
  • Ред 11 показва как да вградите нашия Javascript във вашия сайт.
  • Ред 13 показва как да вградите Web компонента wink-app-loader и да му кажете да зареди вашите конфигурационни предпочитания на ниво страница.

API

Section titled “API”

Разработчици, които искат да управляват решетки, могат да посетят Developers > API > Inventory.

Допълнително четене

Section titled “Допълнително четене”