Kartor

En karta representerar antingen en enskild leverantör (t.ex. hotell eller upplevelseleverantör) eller inventarier (dvs. rumstyp, mötesrum, spa etc.) eller en samling inventarier såsom en kuraterad lista eller sparad sökning och visar dessa detaljer via en interaktiv karta med bokningsbara kartmarkörer. En användare kan interagera med en karta på följande sätt:

Karta med markörer — *Karta med kartmarkörer*

Zooma, panorera och dra kartan för att se tillgängliga inventarier.
Klicka på en kartmarkör för att se inventariedetaljer i form av ett Card.

Karta med öppet kort — *Karta med bokningsbar inventarie*

Resten av denna artikel guidar dig genom hur du skapar, anpassar och delar dina kartor.

Skapa en karta

Kartor kan skapas på två sätt:

Enkel markörkarta: Skapa en karta från något du hittade medan du sökte.
Fler markörkarta: Skapa en karta från en kuraterad lista eller sparad sökning.

Enkel markörkarta

Ovan är en bild tagen från Sök och visar några av de saker du kan göra med dina sökresultat. En av dessa åtgärder är Skapa en karta. Klicka på den knappen så omdirigeras du till vår kartformulärssida där du kan börja anpassa din karta.

Fler markörkarta

Både kuraterade listor och sparade sökningar har en åtgärd som låter dig skapa en karta. Denna karta kommer att innehålla kartmarkörer för all inventarie inom dessa listor.

Anpassa karta

Formuläret låter dig anpassa din karta på följande sätt:

Ge den ett namn så att du kommer ihåg vad kartan handlar om.
Välj om du vill tillåta användaren att flytta runt på kartan.
Ange hur hög, i pixlar, du vill att kartan ska vara.
Välj om du vill tillåta användaren att zooma in och ut på kartan.
Välj en kartstil som passar webbplatsen där du kommer att bädda in kartan.
Välj en markörfärg.
Välj den initiala kortsidan du vill att användarna ska se först. Som standard är det den inbyggda sidan för den inventarien.
Du kan lägga till egna markörer, cirklar, rektanglar och polygoner för att indikera andra platser på kartan som dina användare kan tycka är intressanta.
Klicka på Spara-knappen för att fortsätta.

Efter att du sparat din karta omdirigeras du till din kart-sida och din karta är nu redo att delas med världen.

Dela karta

Ovan visas en bild med alla tillgängliga åtgärder för din karta:

Uppdatera Uppdaterar din kartkonfiguration.
Lägg till i WinkLinks Lägger till kartan i ditt WinkLinks-konto.
Bädda in Visar hur du bäddar in denna karta som en Map på din webbplats.
Använd med WordPress Visar hur du använder vårt WordPress-plugin för att bädda in denna karta på din webbplats.

Vi går igenom några av dessa alternativ mer i detalj nedan.

Bädda in

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="MAP"
       id="64d7cbc8-61df-11ef-9722-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>

Så här bäddar du in din karta på din webbplats:

Rad 3 visar hur du bäddar in Wink-stilarna på din webbplats.
Raderna 6 till 9 visar hur du använder wink-content-loader Web Component och berättar för den att hämta en annonsbanner för din kod.
Rad 11 visar hur du bäddar in vår Javascript på din webbplats.
Rad 13 visar hur du bäddar in wink-app-loader Web Component och berättar för den att hämta dina konfigurationsinställningar på sidnivå.

API

Utvecklare som vill hantera kartor kan gå till Utvecklare > API > Inventarie.

Vidare läsning

Läs mer om vår samling av Web Components.
Läs mer om Wink WordPress-pluginet.