Skip to content

Grids

Et rutenett representerer en liste over leverandører og varelager, og viser detaljene via et interaktivt, bookbart rutenettgrensesnitt. Rutenettet støtter visning av varelager fra din kuraterte liste eller lagrede søk. En bruker samhandler med et rutenett på samme måte som hun samhandler med en person.kortmed én ekstra funksjon:

  1. Bla gjennom rutenettet ved å klikke påShow moreknapp (når flere varer er tilgjengelige).
Forhåndsvisning av rutenett
Rutenett som viser flere romtyper

Over er et eksempel på rutenettet vårt som viser en liste over romtypekort.

Resten av denne artikkelen veileder deg gjennom hvordan du oppretter, tilpasser og eksponerer rutenettet for brukerne dine.

Det finnes tre typer rutenett:

  1. Rutenett basert på etkuratert liste.
  2. Rutenett basert på etlagret søk.
  3. Rutenett basert på en plassering og sorteringskriterier (dvs. rangert rutenett).

Dette er et rutenett som bruker beholdningen du har samlet i en av dine kuraterte lister og konverterer listen til bestillbar reisebeholdning du kan vise til brukerne dine.

Naviger tilInventory > Curated Listsfra hovednavigasjonsfeltet. I dette eksemplet bruker vi dinFavoriteslisten. Hvis du ikke har lagt til noe på listen din ennåFavorites, gå tilSøkå lære hvordan.

Opprett rutenett for kuraterte lister
Opprett rutenettskjema for kuraterte lister
  1. Klikk på Actions knappen på Favorites liste.
  2. Klikk på Create a grid knapp.
  3. Et nytt vindu vil vises, der du kan gi rutenettet ditt et navn. Se nedenfor.
  4. Klikk OK knappen for å fortsette.

Rutenettet ditt er opprettet. Naviger tilTools > Gridsfra hovednavigasjonslinjen og klikk påCurated Gridsfanen for å se det nye rutenettet.

Skjemaet lar deg tilpasse rutenettet ditt på følgende måter:

  1. Gi det et navn slik at du kan huske hva rutenettet handler om.
  2. Velg Tilpasning du vil bruke på dette rutenettet.
  3. Velg den første kortsiden du vil at brukerne skal se først. Som standard er det den opprinnelige siden av den beholdningen.
  4. Velg merket du vil bruke på kortet. Et merke lar brukere sammenligne beholdning på en samlet beregning, for eksempel eco-friendly.
  5. Legg til nøkkelord, atskilt med komma, som skal brukes av Nettroboter.
  6. Legg til titler og beskrivelser på språkene du vil at brukeren skal se.
  7. Klikk på Save knappen for å fortsette.
Kuratert listenett
Kuratert listeoppføring med skjult handlingsmeny

Over ser du et bilde med alle tilgjengelige handlinger for rutenettet ditt:

  • OppdateringOppdaterer rutenettkonfigurasjonen din.
  • Legg til i WinkLinksLegger til rutenettet i WinkLinks-kontoen din.
  • Bygg innViser deg hvordan du bygger inn dette rutenettet som enRutenettinn på nettstedet ditt.
  • Bruk med WordPressViser deg hvordan du bruker vårWordPress-pluginå legge inn dette rutenettet på nettstedet ditt.

Vi dekker noen av disse alternativene mer detaljert nedenfor.

<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>

Slik legger du inn rutenettet ditt på nettstedet ditt:

  • Linje 3 viser deg hvordan du bygger inn Wink-stilene på nettstedet ditt.
  • Linje 6 til 9 viser deg hvordan du brukerwink-innholdslasterWeb-komponenten og be den hente et rutenett for koden din.
  • Linje 11 viser deg hvordan du bygger inn Javascript-koden vår på nettstedet ditt.
  • Linje 13 viser deg hvordan du legger innwink-app-loaderWeb-komponenten og be den hente konfigurasjonsinnstillingene dine på sidenivå.

Dette er et rutenett som bruker beholdningen i det lagrede søket ditt og konverterer søkeresultatene til bestillbar reisebeholdning som du kan vise til brukerne dine.

Naviger tilInventory > Saved searchesfra hovednavigasjonslinjen. Hvis du ikke har opprettet et lagret søk ennå, gå tilSøkå lære hvordan.

Opprett lagret søkerutenett
Opprett lagret søkeruteskjema
  1. Klikk på Actions -knappen på det lagrede søket ditt.
  2. Klikk på Create a grid knapp.
  3. Et nytt vindu vil vises, der du kan gi rutenettet ditt et navn. Se nedenfor.
  1. KlikkOKknappen for å fortsette.

Rutenettet ditt er opprettet. Naviger tilTools > Gridsfra hovednavigasjonslinjen og klikk påSaved Search Gridsfanen for å se det nye rutenettet.

Skjemaet lar deg tilpasse rutenettet ditt på følgende måter:

  1. Gi det et navn slik at du kan huske hva rutenettet handler om.
  2. Velg Tilpasning du vil bruke på dette rutenettet.
  3. Velg den første kortsiden du vil at brukerne skal se først. Som standard er det den opprinnelige siden av den beholdningen.
  4. Velg merket du vil bruke på kortet. Et merke lar brukere sammenligne beholdning på en samlet beregning, for eksempel eco-friendly.
  5. Legg til nøkkelord, atskilt med komma, som skal brukes av Nettroboter.
  6. Legg til titler og beskrivelser på språkene du vil at brukeren skal se.
  7. Klikk på Save knappen for å fortsette.
Lagret søkerutenett
Lagret søkerutenettoppføring med skjult handlingsmeny
<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>

Slik legger du inn rutenettet ditt på nettstedet ditt:

  • Linje 3 viser deg hvordan du bygger inn Wink-stilene på nettstedet ditt.
  • Linje 6 til 9 viser deg hvordan du brukerwink-innholdslasterWeb-komponenten og be den hente et rutenett for koden din.
  • Linje 11 viser deg hvordan du bygger inn Javascript-koden vår på nettstedet ditt.
  • Linje 13 viser deg hvordan du legger innwink-app-loaderWeb-komponenten og be den hente konfigurasjonsinnstillingene dine på sidenivå.

Lag et rangert rutenett ved å navigere tilTools > Gridsog klikk påRanked Gridfanen. Klikk påCreate ranked gridknapp.

Skjemaet lar deg tilpasse det rangerte rutenettet på følgende måter:

  1. Velg en destinasjon. F.eks. Tokyo.
  2. Gi det et navn slik at du kan huske hva rutenettet handler om. F.eks. miljøvennlige hoteller i Tokyo
  3. Velg Tilpasning du vil bruke på dette rutenettet.
  4. Velg den første kortsiden du vil at brukerne skal se først. Som standard er det den opprinnelige siden av den beholdningen.
  5. Velg hvilken egenskap du vil sortere egenskaper etter. F.eks. miljøvennlighet.
  6. Legg til nøkkelord, atskilt med komma, som skal brukes av Nettroboter.
  7. Legg til titler og beskrivelser på språkene du vil at brukeren skal se.
  8. Klikk på Save knappen for å fortsette.

Etter at du har lagret det rangerte rutenettet, blir du omdirigert til siden for rangerte rutenett, og rutenettet ditt er nå klart til å deles med verden.

Rangert rutenett
Et rangert rutenett med skjult handlingsmeny

Over ser du et bilde med alle tilgjengelige handlinger for rangeringsnettet ditt:

  • OppdateringOppdaterer rutenettkonfigurasjonen din.
  • Legg til i WinkLinksLegger til det rangerte rutenettet i WinkLinks-kontoen din.
  • Bygg innViser deg hvordan du bygger inn dette rutenettet som enRutenettinn på nettstedet ditt.
  • Bruk med WordPressViser deg hvordan du bruker vårWordPress-pluginå legge inn dette kortet på nettstedet ditt.

Vi dekker noen av disse alternativene mer detaljert nedenfor.

<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>

Slik legger du inn rutenettet ditt på nettstedet ditt:

  • Linje 3 viser deg hvordan du bygger inn Wink-stilene på nettstedet ditt.
  • Linje 6 til 9 viser deg hvordan du brukerwink-innholdslasterWeb-komponenten og be den hente et rangert rutenett for koden din.
  • Linje 11 viser deg hvordan du bygger inn Javascript-koden vår på nettstedet ditt.
  • Linje 13 viser deg hvordan du legger innwink-app-loaderWeb-komponenten og be den hente konfigurasjonsinnstillingene dine på sidenivå.

Utviklere som ønsker å administrere nett kan gå tilUtviklere > API > Inventar.