Saltar al contingut
Academy

Reixetes

Una reixeta representa una llista de proveïdors i inventari i exposa els detalls a través d’una interfície interactiva i reservable en forma de reixeta. La reixeta suporta mostrar qualsevol inventari de la teva llista seleccionada o cerca guardada. Un usuari interactua amb una reixeta de la mateixa manera que interactua amb una targeta individual amb una característica addicional:

  1. Paginació a través de la reixeta fent clic al botó Mostra més (quan hi ha més elements disponibles).
Vista prèvia de la reixeta
Reixeta mostrant múltiples tipus d’habitació

A dalt tens un exemple de la nostra reixeta mostrant una llista de targetes de tipus d’habitació.

La resta d’aquest article t’explica com crear, personalitzar i exposar la reixeta als teus usuaris.

Tipus de reixetes

Section titled “Tipus de reixetes”

Hi ha tres tipus de reixetes:

  1. Reixeta basada en una llista seleccionada.
  2. Reixeta basada en una cerca guardada.
  3. Reixeta basada en una ubicació i criteris d’ordenació (és a dir, reixeta classificada).

Reixeta de llista seleccionada

Section titled “Reixeta de llista seleccionada”

Aquesta és una reixeta que utilitza l’inventari que has recopilat en una de les teves llistes seleccionades i converteix la llista en inventari de viatge reservable que pots mostrar als teus usuaris.

Crear

Section titled “Crear”

Navega a Inventari > Llistes seleccionades des de la barra de navegació principal. Per aquest exemple, farem servir la teva llista Favorits. Si encara no has afegit res als teus Favorits, ves a Cerca per aprendre com fer-ho.

Formulari per crear reixeta de llista seleccionada
Formulari per crear reixeta de llista seleccionada
  1. Fes clic al botó Accions a la llista Favorits.
  2. Fes clic al botó Crea una reixeta.
  3. Apareixerà una nova finestra que et permetrà posar un nom a la teva reixeta. Vegeu més avall.
  4. Fes clic al botó D'acord per continuar.

La teva reixeta ha estat creada. Navega a Eines > Reixetes des de la barra de navegació principal i fes clic a la pestanya Reixetes seleccionades per veure la teva nova reixeta.

Personalitzar

Section titled “Personalitzar”

El formulari et permet personalitzar la teva reixeta de les següents maneres:

  1. Dona-li un nom per recordar de què tracta la reixeta.
  2. Selecciona la Personalització que vols aplicar a aquesta reixeta.
  3. Selecciona la cara inicial de la targeta que vols que els usuaris vegin primer. Per defecte, és la cara nativa d’aquest inventari.
  4. Selecciona la insígnia que vols utilitzar a la targeta. Una insígnia permet als usuaris comparar inventari segons una mètrica agregada com ara ecològic.
  5. Afegeix paraules clau, separades per comes, que seran utilitzades pels Web Crawlers.
  6. Afegeix títols i descripcions en els idiomes que vols que l’usuari vegi.
  7. Fes clic al botó Desa per continuar.

Compartir

Section titled “Compartir”
Reixeta de llista seleccionada
Entrada de reixeta de llista seleccionada amb menú d’accions col·lapsat

A dalt tens una imatge amb totes les accions disponibles per a la teva reixeta:

  • Actualitza Actualitza la configuració de la teva reixeta.
  • Afegeix a WinkLinks Afegeix la reixeta al teu compte de WinkLinks.
  • Incrusta T’explica com incrustar aquesta reixeta com un Grid al teu lloc web.
  • Usa amb WordPress T’explica com utilitzar el nostre plugin de WordPress per incrustar aquesta reixeta al teu lloc web.

Cobrim algunes d’aquestes opcions amb més detall a continuació.

Incrustar

Section titled “Incrustar”
<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>

Aquí tens com incrustar la teva reixeta al teu lloc:

  • La línia 3 mostra com incrustar els estils de Wink al teu lloc.
  • Les línies 6 a 9 mostren com utilitzar el Web Component wink-content-loader i indicar-li que carregui una reixeta per al teu codi.
  • La línia 11 mostra com incrustar el nostre Javascript al teu lloc.
  • La línia 13 mostra com incrustar el Web Component wink-app-loader i indicar-li que carregui les preferències de configuració a nivell de pàgina.

Reixeta de cerca guardada

Section titled “Reixeta de cerca guardada”

Aquesta és una reixeta que utilitza l’inventari de la teva consulta de cerca guardada i converteix els resultats de la cerca en inventari de viatge reservable que pots mostrar als teus usuaris.

Crear

Section titled “Crear”

Navega a Inventari > Cerques guardades des de la barra de navegació principal. Si encara no has creat cap cerca guardada, ves a Cerca per aprendre com fer-ho.

Formulari per crear reixeta de cerca guardada
Formulari per crear reixeta de cerca guardada
  1. Fes clic al botó Accions a la teva cerca guardada.
  2. Fes clic al botó Crea una reixeta.
  3. Apareixerà una nova finestra que et permetrà posar un nom a la teva reixeta. Vegeu més avall.
  1. Fes clic al botó D'acord per continuar.

La teva reixeta ha estat creada. Navega a Eines > Reixetes des de la barra de navegació principal i fes clic a la pestanya Reixetes de cerca guardada per veure la teva nova reixeta.

Personalitzar

Section titled “Personalitzar”

El formulari et permet personalitzar la teva reixeta de les següents maneres:

  1. Dona-li un nom per recordar de què tracta la reixeta.
  2. Selecciona la Personalització que vols aplicar a aquesta reixeta.
  3. Selecciona la cara inicial de la targeta que vols que els usuaris vegin primer. Per defecte, és la cara nativa d’aquest inventari.
  4. Selecciona la insígnia que vols utilitzar a la targeta. Una insígnia permet als usuaris comparar inventari segons una mètrica agregada com ara ecològic.
  5. Afegeix paraules clau, separades per comes, que seran utilitzades pels Web Crawlers.
  6. Afegeix títols i descripcions en els idiomes que vols que l’usuari vegi.
  7. Fes clic al botó Desa per continuar.

Compartir

Section titled “Compartir”
Reixeta de cerca guardada
Entrada de reixeta de cerca guardada amb menú d’accions col·lapsat

Incrustar

Section titled “Incrustar”
<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>

Aquí tens com incrustar la teva reixeta al teu lloc:

  • La línia 3 mostra com incrustar els estils de Wink al teu lloc.
  • Les línies 6 a 9 mostren com utilitzar el Web Component wink-content-loader i indicar-li que carregui una reixeta per al teu codi.
  • La línia 11 mostra com incrustar el nostre Javascript al teu lloc.
  • La línia 13 mostra com incrustar el Web Component wink-app-loader i indicar-li que carregui les preferències de configuració a nivell de pàgina.

Reixeta classificada

Section titled “Reixeta classificada”

Crear

Section titled “Crear”

Crea una reixeta classificada navegant a Eines > Reixetes i fes clic a la pestanya Reixeta classificada. Fes clic al botó Crea reixeta classificada.

Personalitzar

Section titled “Personalitzar”

El formulari et permet personalitzar la teva reixeta classificada de les següents maneres:

  1. Tria una destinació. Per exemple, Tòquio.
  2. Dona-li un nom per recordar de què tracta la reixeta. Per exemple, Hotels ecològics a Tòquio
  3. Selecciona la Personalització que vols aplicar a aquesta reixeta.
  4. Selecciona la cara inicial de la targeta que vols que els usuaris vegin primer. Per defecte, és la cara nativa d’aquest inventari.
  5. Tria quina característica vols utilitzar per ordenar les propietats. Per exemple, ecològic.
  6. Afegeix paraules clau, separades per comes, que seran utilitzades pels Web Crawlers.
  7. Afegeix títols i descripcions en els idiomes que vols que l’usuari vegi.
  8. Fes clic al botó Desa per continuar.

Després de desar la teva reixeta classificada, seràs redirigit a la pàgina de les teves reixetes classificades i la teva reixeta ja estarà llesta per compartir amb el món.

Compartir

Section titled “Compartir”
Reixeta classificada
Una reixeta classificada amb menú d’accions col·lapsat

A dalt tens una imatge amb totes les accions disponibles per a la teva reixeta classificada:

  • Actualitza Actualitza la configuració de la teva reixeta.
  • Afegeix a WinkLinks Afegeix la reixeta classificada al teu compte de WinkLinks.
  • Incrusta T’explica com incrustar aquesta reixeta com un Grid al teu lloc web.
  • Usa amb WordPress T’explica com utilitzar el nostre plugin de WordPress per incrustar aquesta targeta al teu lloc web.

Cobrim algunes d’aquestes opcions amb més detall a continuació.

Incrustar

Section titled “Incrustar”
<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>

Aquí tens com incrustar la teva reixeta al teu lloc:

  • La línia 3 mostra com incrustar els estils de Wink al teu lloc.
  • Les línies 6 a 9 mostren com utilitzar el Web Component wink-content-loader i indicar-li que carregui una reixeta classificada per al teu codi.
  • La línia 11 mostra com incrustar el nostre Javascript al teu lloc.
  • La línia 13 mostra com incrustar el Web Component wink-app-loader i indicar-li que carregui les preferències de configuració a nivell de pàgina.

API

Section titled “API”

Els desenvolupadors que vulguin gestionar reixetes poden anar a Developers > API > Inventory.

Lectura addicional

Section titled “Lectura addicional”