Tovább a tartalomhoz
Wink

Rácsok

A rács egy beszállítók és készletek listáját jelenti, és egy interaktív, foglalható rács felületen keresztül teszi elérhetővé a részleteket. A rács bármely készlet megjelenítését támogatja a válogatott listájából vagy mentett kereséséből. A felhasználó ugyanúgy lép interakcióba egy rácssal, mint egy egyedi kártyával, egy további funkcióval:

  1. Lapozhat a rácsban a Továbbiak megjelenítése gombra kattintva (ha több elem elérhető).
Rács előnézet
Rács, amely több szobatípust mutat

Fent egy példa a rácsunkra, amely szobatípus-kártyák listáját mutatja.

A cikk további része végigvezeti, hogyan hozhat létre, testreszabhat és tehet elérhetővé rácsot a felhasználói számára.

Rácstípusok

Szekció neve “Rácstípusok”

Háromféle rács létezik:

  1. Rács egy válogatott lista alapján.
  2. Rács egy mentett keresés alapján.
  3. Rangsorolt rács hely és rendezési kritérium alapján (azaz rangsorolt rács).

Válogatott lista rács

Szekció neve “Válogatott lista rács”

Ez egy olyan rács, amely a válogatott listájában összegyűjtött készletet használja, és a listát foglalható utazási készletté alakítja, amelyet megjeleníthet a felhasználóknak.

Létrehozás

Szekció neve “Létrehozás”

Navigáljon a Listák > Válogatott menüpontra a fő navigációs sávból. Ehhez a példához a Kedvencek listáját fogjuk használni. Ha még nem adott hozzá semmit a Kedvencek listához, látogasson el a Keresés oldalra, hogy megtanulja, hogyan.

Válogatott lista rács létrehozása
Válogatott lista rács létrehozási űrlap
  1. Kattintson az Műveletek gombra a Kedvencek listán.
  2. Kattintson a Rács létrehozása gombra.
  3. Egy új ablak jelenik meg, ahol elnevezheti a rácsot. Lásd lent.
  4. Kattintson az OK gombra a folytatáshoz.

A rács létrejött. Navigáljon a Rácsok menüpontra a fő navigációs sávból, és kattintson a Válogatott fülre, hogy megtekinthesse az új rácsot.

Testreszabás

Szekció neve “Testreszabás”

Az űrlap lehetővé teszi a rács testreszabását az alábbi módokon:

  1. Adjon neki egy nevet, hogy emlékezzen, miről szól a rács.
  2. Válassza ki a Testreszabást, amelyet alkalmazni szeretne erre a rácsra.
  3. Válassza ki az első kártyaoldalt, amelyet a felhasználók először látnak. Alapértelmezés szerint az adott készlet natív oldala.
  4. Válassza ki a jelvényt, amelyet a kártyán használni szeretne. A jelvény lehetővé teszi a felhasználók számára, hogy egy összesített mutató, például környezetbarát alapján hasonlítsák össze a készletet.
  5. Adjon meg kulcsszavakat, vesszővel elválasztva, amelyeket a Web Crawlers használnak.
  6. Adjon meg címeket és leírásokat azokban a nyelvekben, amelyeket a felhasználó látni fog.
  7. Kattintson a Mentés gombra a folytatáshoz.

Megosztás

Szekció neve “Megosztás”
Válogatott lista rács
Válogatott lista rács bejegyzés összecsukott műveleti menüvel

Fent látható egy kép az összes elérhető műveletről a rácsához:

  • Frissítés Frissíti a rács konfigurációját.
  • Hozzáadás a WinkLinkshez Hozzáadja a rácsot a WinkLinks fiókjához.
  • Beágyazás Megmutatja, hogyan ágyazhatja be ezt a rácsot Rácsként a weboldalára.
  • Használat WordPress-szel Megmutatja, hogyan használhatja a WordPress bővítményünket a rács beágyazásához a weboldalán.

Ezek közül néhány lehetőséget részletesebben is bemutatunk lent.

Beágyazás

Szekció neve “Beágyazás”
<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>

Így ágyazhatja be a rácsot az oldalába:

  • A 3. sor megmutatja, hogyan ágyazhatja be a Wink stílusokat az oldalába.
  • A 6-9. sorok megmutatják, hogyan használja a wink-content-loader Web Komponenst, és hogyan kérjen le egy rácsot a kódjához.
  • A 11. sor megmutatja, hogyan ágyazza be a Javascriptünket az oldalába.
  • A 13. sor megmutatja, hogyan ágyazza be a wink-app-loader Web Komponenst, és hogyan kérje le az oldal szintű konfigurációs beállításait.

Mentett keresés rács

Szekció neve “Mentett keresés rács”

Ez egy olyan rács, amely a mentett keresési lekérdezésében lévő készletet használja, és a keresési eredményeket foglalható utazási készletté alakítja, amelyet megjeleníthet a felhasználóknak.

Létrehozás

Szekció neve “Létrehozás”

Navigáljon a Listák > Dinamikus menüpontra a fő navigációs sávból. Ha még nem hozott létre mentett keresést, látogasson el a Keresés oldalra, hogy megtanulja, hogyan.

Mentett keresés rács létrehozása
Mentett keresés rács létrehozási űrlap
  1. Kattintson az Műveletek gombra a mentett keresésén.
  2. Kattintson a Rács létrehozása gombra.
  3. Egy új ablak jelenik meg, ahol elnevezheti a rácsot. Lásd lent.
  1. Kattintson az OK gombra a folytatáshoz.

A rács létrejött. Navigáljon a Rácsok menüpontra a fő navigációs sávból, és kattintson a Keresések fülre, hogy megtekinthesse az új rácsot.

Testreszabás

Szekció neve “Testreszabás”

Az űrlap lehetővé teszi a rács testreszabását az alábbi módokon:

  1. Adjon neki egy nevet, hogy emlékezzen, miről szól a rács.
  2. Válassza ki a Testreszabást, amelyet alkalmazni szeretne erre a rácsra.
  3. Válassza ki az első kártyaoldalt, amelyet a felhasználók először látnak. Alapértelmezés szerint az adott készlet natív oldala.
  4. Válassza ki a jelvényt, amelyet a kártyán használni szeretne. A jelvény lehetővé teszi a felhasználók számára, hogy egy összesített mutató, például környezetbarát alapján hasonlítsák össze a készletet.
  5. Adjon meg kulcsszavakat, vesszővel elválasztva, amelyeket a Web Crawlers használnak.
  6. Adjon meg címeket és leírásokat azokban a nyelvekben, amelyeket a felhasználó látni fog.
  7. Kattintson a Mentés gombra a folytatáshoz.

Megosztás

Szekció neve “Megosztás”
Mentett keresés rács
Mentett keresés rács bejegyzés összecsukott műveleti menüvel

Beágyazás

Szekció neve “Beágyazás”
<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>

Így ágyazhatja be a rácsot az oldalába:

  • A 3. sor megmutatja, hogyan ágyazhatja be a Wink stílusokat az oldalába.
  • A 6-9. sorok megmutatják, hogyan használja a wink-content-loader Web Komponenst, és hogyan kérjen le egy rácsot a kódjához.
  • A 11. sor megmutatja, hogyan ágyazza be a Javascriptünket az oldalába.
  • A 13. sor megmutatja, hogyan ágyazza be a wink-app-loader Web Komponenst, és hogyan kérje le az oldal szintű konfigurációs beállításait.

Rangsorolt rács

Szekció neve “Rangsorolt rács”

Létrehozás

Szekció neve “Létrehozás”

Hozzon létre rangsorolt rácsot a Rácsok menüpontra navigálva, majd kattintson a Rangsorolt fülre. Kattintson a Rangsorolt rács létrehozása gombra.

Testreszabás

Szekció neve “Testreszabás”

Az űrlap lehetővé teszi a rangsorolt rács testreszabását az alábbi módokon:

  1. Válasszon úti célt. Pl. Tokió.
  2. Adjon neki egy nevet, hogy emlékezzen, miről szól a rács. Pl. Környezetbarát szállodák Tokióban
  3. Válassza ki a Testreszabást, amelyet alkalmazni szeretne erre a rácsra.
  4. Válassza ki az első kártyaoldalt, amelyet a felhasználók először látnak. Alapértelmezés szerint az adott készlet natív oldala.
  5. Válassza ki, milyen jellemző szerint rendezze az ingatlanokat. Pl. Környezetbarátság.
  6. Adjon meg kulcsszavakat, vesszővel elválasztva, amelyeket a Web Crawlers használnak.
  7. Adjon meg címeket és leírásokat azokban a nyelvekben, amelyeket a felhasználó látni fog.
  8. Kattintson a Mentés gombra a folytatáshoz.

A rangsorolt rács mentése után átirányítják a rangsorolt rácsok oldalára, és a rács készen áll a megosztásra.

Megosztás

Szekció neve “Megosztás”
Rangsorolt rács
Rangsorolt rács összecsukott műveleti menüvel

Fent látható egy kép az összes elérhető műveletről a rangsorolt rácsához:

  • Frissítés Frissíti a rács konfigurációját.
  • Hozzáadás a WinkLinkshez Hozzáadja a rangsorolt rácsot a WinkLinks fiókjához.
  • Beágyazás Megmutatja, hogyan ágyazhatja be ezt a rácsot Rácsként a weboldalára.
  • Használat WordPress-szel Megmutatja, hogyan használhatja a WordPress bővítményünket a kártya beágyazásához a weboldalán.

Ezek közül néhány lehetőséget részletesebben is bemutatunk lent.

Beágyazás

Szekció neve “Beágyazás”
<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>

Így ágyazhatja be a rácsot az oldalába:

  • A 3. sor megmutatja, hogyan ágyazhatja be a Wink stílusokat az oldalába.
  • A 6-9. sorok megmutatják, hogyan használja a wink-content-loader Web Komponenst, és hogyan kérjen le egy rangsorolt rácsot a kódjához.
  • A 11. sor megmutatja, hogyan ágyazza be a Javascriptünket az oldalába.
  • A 13. sor megmutatja, hogyan ágyazza be a wink-app-loader Web Komponenst, és hogyan kérje le az oldal szintű konfigurációs beállításait.

API

Szekció neve “API”

A fejlesztők, akik rácsokat szeretnének kezelni, látogassanak el a Fejlesztők > API > Készlet oldalra.

További olvasnivaló

Szekció neve “További olvasnivaló”