Grids
Een raster geeft een lijst met leveranciers en voorraad weer en toont de details via een interactieve, boekbare rasterinterface. Het raster ondersteunt de weergave van elke voorraad uit uw samengestelde lijst of opgeslagen zoekopdracht. Een gebruiker communiceert met een raster op dezelfde manier als met een individu.kaartmet één extra functie:
- Blader door het raster door op de knop te klikken
Show more
knop (wanneer er meer artikelen beschikbaar zijn).
Hierboven ziet u een voorbeeld van ons raster met een lijst met kamertypekaarten.
In de rest van dit artikel leggen we u uit hoe u het raster kunt maken, aanpassen en beschikbaar kunt stellen aan uw gebruikers.
Rastertypen
Section titled “Rastertypen”Er zijn drie soorten roosters:
- Raster gebaseerd op eensamengestelde lijst.
- Raster gebaseerd op eenopgeslagen zoekopdracht.
- Raster op basis van locatie en sorteercriteria (d.w.z. gerangschikt raster).
Gecureerde lijstraster
Section titled “Gecureerde lijstraster”Dit is een raster dat gebruikmaakt van de inventaris die u in een van uw samengestelde lijsten hebt verzameld. Deze lijst wordt vervolgens omgezet in een boekbare reisinventaris die u aan uw gebruikers kunt tonen.
Creëren
Section titled “Creëren”Navigeren naarInventory > Curated Lists
vanuit de hoofdnavigatiebalk. Voor dit voorbeeld gebruiken we uwFavorites
lijst.
Als je nog niets aan je lijst hebt toegevoegd,Favorites
, ga naarZoekopdrachtom te leren hoe.
- Klik op de
Actions
knop op deFavorites
lijst. - Klik op de
Create a grid
knop. - Er verschijnt een nieuw venster waarin u het raster een naam kunt geven. Zie hieronder.
- Klik
OK
knop om door te gaan.
Je raster is aangemaakt. Navigeer naarTools > Grids
vanuit de hoofdnavigatiebalk en klik op deCurated Grids
Tik op Tab om uw nieuwe raster te bekijken.
Aanpassen
Section titled “Aanpassen”Met het formulier kunt u uw raster op de volgende manieren aanpassen:
- Geef het een naam, zodat u kunt onthouden waar het raster over gaat.
- Selecteer de Maatwerk die u op dit raster wilt toepassen.
- Selecteer de eerste kaartzijde die gebruikers als eerste moeten zien. Standaard is dit de oorspronkelijke zijde van die inventaris.
- Selecteer de badge die u op de kaart wilt gebruiken. Met een badge kunnen gebruikers de voorraad vergelijken op basis van een geaggregeerde metriek, zoals
eco-friendly
. - Voeg trefwoorden toe, gescheiden door een komma, die gebruikt zullen worden door Webcrawlers.
- Voeg titels en beschrijvingen toe in de talen die u aan de gebruiker wilt laten zien.
- Klik op de
Save
knop om door te gaan.
Hierboven ziet u een afbeelding met alle beschikbare acties voor uw raster:
- UpdateWerkt uw rasterconfiguratie bij.
- Toevoegen aan WinkLinksVoegt het raster toe aan uw WinkLinks-account.
- InsluitenLaat zien hoe u dit raster als eenRoosterop uw website.
- Gebruik met WordPressLaat u zien hoe u onzeWordPress-plug-inom dit raster in uw website te integreren.
Hieronder gaan we dieper in op een aantal van deze opties.
Insluiten
Section titled “Insluiten”<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>
Zo kunt u uw raster in uw site insluiten:
- Regel 3 laat zien hoe u de Wink-stijlen in uw site kunt insluiten.
- Regels 6 tot en met 9 laten zien hoe u deknipoog-inhoud-laderWebcomponent en vertel het dat het een raster voor uw code moet ophalen.
- Regel 11 laat zien hoe u Javascript in uw site kunt integreren.
- Regel 13 laat zien hoe je dewink-app-loaderWebcomponent en geef aan dat deze uw configuratievoorkeuren op paginaniveau moet ophalen.
Opgeslagen zoekraster
Section titled “Opgeslagen zoekraster”Dit is een raster dat gebruikmaakt van de inventaris in uw opgeslagen zoekopdracht en de zoekresultaten omzet in boekbare reisinventaris die u aan uw gebruikers kunt tonen.
Creëren
Section titled “Creëren”Navigeren naarInventory > Saved searches
vanuit de hoofdnavigatiebalk.
Als je nog geen opgeslagen zoekopdracht hebt gemaakt, ga dan naarZoekopdrachtom te leren hoe.
- Klik op de
Actions
knop op uw opgeslagen zoekopdracht. - Klik op de
Create a grid
knop. - Er verschijnt een nieuw venster waarin u het raster een naam kunt geven. Zie hieronder.
- Klik
OK
knop om door te gaan.
Je raster is aangemaakt. Navigeer naarTools > Grids
vanuit de hoofdnavigatiebalk en klik op deSaved Search Grids
Tik op Tab om uw nieuwe raster te bekijken.
Aanpassen
Section titled “Aanpassen”Met het formulier kunt u uw raster op de volgende manieren aanpassen:
- Geef het een naam, zodat u kunt onthouden waar het raster over gaat.
- Selecteer de Maatwerk die u op dit raster wilt toepassen.
- Selecteer de eerste kaartzijde die gebruikers als eerste moeten zien. Standaard is dit de oorspronkelijke zijde van die inventaris.
- Selecteer de badge die u op de kaart wilt gebruiken. Met een badge kunnen gebruikers de voorraad vergelijken op basis van een geaggregeerde metriek, zoals
eco-friendly
. - Voeg trefwoorden toe, gescheiden door een komma, die gebruikt zullen worden door Webcrawlers.
- Voeg titels en beschrijvingen toe in de talen die u aan de gebruiker wilt laten zien.
- Klik op de
Save
knop om door te gaan.
Insluiten
Section titled “Insluiten”<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>
Zo kunt u uw raster in uw site insluiten:
- Regel 3 laat zien hoe u de Wink-stijlen in uw site kunt insluiten.
- Regels 6 tot en met 9 laten zien hoe u deknipoog-inhoud-laderWebcomponent en vertel het dat het een raster voor uw code moet ophalen.
- Regel 11 laat zien hoe u Javascript in uw site kunt integreren.
- Regel 13 laat zien hoe je dewink-app-loaderWebcomponent en geef aan dat deze uw configuratievoorkeuren op paginaniveau moet ophalen.
Gerangschikt raster
Section titled “Gerangschikt raster”Creëren
Section titled “Creëren”Maak een gerangschikt raster door naar te navigerenTools > Grids
en klik op deRanked Grid
tabblad. Klik op deCreate ranked grid
knop.
Aanpassen
Section titled “Aanpassen”Met het formulier kunt u uw rangschikkingsraster op de volgende manieren aanpassen:
- Kies een bestemming. Bijvoorbeeld Tokio.
- Geef het een naam, zodat u kunt onthouden waar het raster over gaat. Bijvoorbeeld milieuvriendelijke hotels in Tokio
- Selecteer de Maatwerk die u op dit raster wilt toepassen.
- Selecteer de eerste kaartzijde die gebruikers als eerste moeten zien. Standaard is dit de oorspronkelijke zijde van die inventaris.
- Kies op welke kenmerken u de eigendommen wilt sorteren. Bijvoorbeeld milieuvriendelijkheid.
- Voeg trefwoorden toe, gescheiden door een komma, die gebruikt zullen worden door Webcrawlers.
- Voeg titels en beschrijvingen toe in de talen die u aan de gebruiker wilt laten zien.
- Klik op de
Save
knop om door te gaan.
Nadat u uw gerangschikte raster hebt opgeslagen, wordt u doorgestuurd naar de pagina met uw gerangschikte rasters. Uw raster is nu klaar om met de wereld te delen.
Hierboven ziet u een afbeelding met alle beschikbare acties voor uw gerangschikte raster:
- UpdateWerkt uw rasterconfiguratie bij.
- Toevoegen aan WinkLinksVoegt het gerangschikte raster toe aan uw WinkLinks-account.
- InsluitenLaat zien hoe u dit raster als eenRoosterop uw website.
- Gebruik met WordPressLaat u zien hoe u onzeWordPress-plug-inom deze kaart in uw website te integreren.
Hieronder gaan we dieper in op een aantal van deze opties.
Insluiten
Section titled “Insluiten”<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>
Zo kunt u uw raster in uw site insluiten:
- Regel 3 laat zien hoe u de Wink-stijlen in uw site kunt insluiten.
- Regels 6 tot en met 9 laten zien hoe u deknipoog-inhoud-laderWebcomponent en vertel het dat het een gerangschikt raster voor uw code moet ophalen.
- Regel 11 laat zien hoe u Javascript in uw site kunt integreren.
- Regel 13 laat zien hoe je dewink-app-loaderWebcomponent en geef aan dat deze uw configuratievoorkeuren op paginaniveau moet ophalen.
Ontwikkelaars die grids willen beheren, kunnen terecht bijOntwikkelaars > API > Inventaris.
Verder lezen
Section titled “Verder lezen”- Ontdek meer over onze collectieWebcomponenten.
- Leer meer over deWink WordPress-plug-in.