Hoppa till innehåll
Academy

Cards

Ett kort representerar en enskild leverantör (t.ex. hotell eller upplevelseleverantör) eller inventarielager (t.ex. rumstyp, mötesrum, spa etc.) och visar informationen via ett interaktivt, bokningsbart kortgränssnitt.

En användare kan interagera med ett kort på följande sätt:

  • Klicka påBookknappen.
  • Klicka påGallerylänk för att se alla foton och videor för detta inventarium.
  • KlickaBest deallänk, om tillgänglig, för att se det bästa priset på rummet.
  • KlickaHotel detailslänk, om sådan finns, för att se fastighetsinformation.

Ett kort stöder flera sidor för att minimera kortets storlek och kategorisera informationen. Detta gör det enkelt för användaren att använda det och ger dig en större chans att konvertera användaren till en bokning.

Ett kort har antingen två eller tre sidor:

  • Ett hotellkort visar boendeinformation på framsidan och den bästa rumstypen på baksidan. Priset, på båda sidor, visar det bästa priset för hotellet.
  • Ett rumstypskort visar rumstypsinformation på framsidan och hotellinformation på baksidan. Priset visar priset för rumstypen på framsidan och det bästa priset för hotellet på baksidan.
  • Alla andra kort (t.ex. sparestaurang etc.) har tre sidor. Exempel: Spadata visas på förstasidan med spaets bästa pris. Rumstypdata för det mest prissatta rummet finns på den andra sidan. Fastighetsdata tillsammans med det mest prissatta rummet finns på den tredje kortsidan.
Förhandsgranskning av kort
Rumstypskort för framsidan med tillgänglighet

Ovanstående är ett exempel på vår rumstypskarta. Den innehåller information om boende, recensioner och rum samt avbokningsregler och måltider.

Resten av den här artikeln guidar dig genom hur du skapar, anpassar och visar kortet för dina användare.

Skapa ett kort

Section titled “Skapa ett kort”
Åtgärder
Åtgärder i sökresultaten

Ovan är en bild tagen frånSökaoch visar dig några av de saker du kan göra med dina sökresultat. En av dessa åtgärder ärMake a card. Klicka på den knappen så omdirigeras du till vår kortformulärsida där du kan börja anpassa ditt kort.

Anpassa kortet

Section titled “Anpassa kortet”

Med formuläret kan du anpassa ditt kort på följande sätt:

  1. Ge det ett namn så att du kommer ihåg vad kortet handlar om.
  2. Välj Anpassning du vill ansöka om det här kortet.
  3. Välj den kortvy som du vill att användarna ska se först. Som standard är det den ursprungliga vyn för det lagret.
  4. Välj badge du vill använda på kortet. Ett märke låter användare jämföra annonsutrymme på ett aggregerat mätvärde som eco-friendly.
  5. Lägg till nyckelord, separerade med kommatecken, som kommer att användas av Webbcrawlers.
  6. Lägg till titlar och beskrivningar på de språk du vill att användaren ska se.
  7. Välj en eller flera bilder som ska visas när användare klickar på Gallery länk.
  8. Klicka på Save knappen för att fortsätta.

När du har sparat ditt kort omdirigeras du till din kortsida och ditt kort är nu redo att delas med världen.

Dela kort

Section titled “Dela kort”
Kort
Kort med hopfälld åtgärdsmeny

Ovanstående bild visar alla tillgängliga åtgärder för ditt kort:

  • UppdateraUppdaterar din kortkonfiguration.
  • Lägg till i WinkLinksLägger till kortet i ditt WinkLinks-konto.
  • Bädda inVisar hur du bäddar in det här kortet som enKortin på din webbplats.
  • Använd med WordPressVisar dig hur du använder vårWordPress-pluginatt bädda in det här kortet på din webbplats.

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

Bädda in

Section titled “Bädda in”
<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>
    <wink-content-loader
       layout="GUEST_ROOM"
       id="2de7ee9c-61c9-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 ditt kort på din webbplats:

  • Rad 3 visar hur du bäddar in Wink-stilarna på din webbplats.
  • Raderna 6 till 9 visar hur du använderwink-innehållsladdareWebbkomponenten och be den hämta ett gästrumskort för din kod.
  • Rad 11 visar hur du bäddar in vårt Javascript på din webbplats.
  • Rad 13 visar hur du bäddar inwink-app-loaderWebbkomponenten och be den hämta dina konfigurationsinställningar på sidnivå.

API

Section titled “API”

Utvecklare som vill hantera kort kan gå vidare tillUtvecklare > API > Inventering.

Vidare läsning

Section titled “Vidare läsning”