Siirry sisältöön

Kortit

Kortti edustaa yhtä toimittajaa (esim. hotelli tai elämysjärjestäjä) tai varastoa (eli huonetyyppi, kokoushuone, spa jne.) ja esittää tiedot interaktiivisessa, varattavassa kortin käyttöliittymässä. Käyttäjä voi olla vuorovaikutuksessa kortin kanssa seuraavilla tavoilla:

  • Klikkaa Varaa-painiketta.
  • Klikkaa Galleria-linkkiä nähdäksesi kaikki kuvat ja videot tästä varastosta.
  • Klikkaa Paras tarjous -linkkiä, jos saatavilla, nähdäksesi parhaan hintaisen huoneen.
  • Klikkaa Hotellin tiedot -linkkiä, jos saatavilla, nähdäksesi kiinteistön tiedot.

Kortti tukee useita puolia kortin koon minimoimiseksi ja tietojen luokittelemiseksi; näin käyttäjän on helppo omaksua tiedot ja sinulla on paremmat mahdollisuudet muuttaa käyttäjä varaukseksi.

Kortilla on joko kaksi tai kolme puolta:

  • Hotellikortti näyttää kiinteistötiedot etupuolella ja parhaan huonetyypin takapuolella. Hinta molemmilla puolilla näyttää hotellin parhaan hinnan.
  • Huonetyypin kortti näyttää huonetyypin tiedot etupuolella ja kiinteistötiedot takapuolella. Hinta näyttää huonetyypin hinnan etupuolella ja hotellin parhaan hinnan takapuolella.
  • Kaikilla muilla korteilla (esim. spa, ravintola jne.) on 3 puolta. Esimerkki: Spa-tiedot näkyvät etusivulla parhaan spa-hinnan kanssa. Parhaan hintaisen huonetyypin tiedot ovat toisella puolella. Kiinteistötiedot yhdessä parhaan hintaisen huoneen kanssa ovat kolmannella kortin puolella.
Kortin esikatselu
Etupuolelta näkyvä huonetyypin kortti saatavuustiedoilla

Yllä on esimerkki huonetyypin kortistamme. Se sisältää kiinteistön, arvostelut ja huonetiedot sekä peruutusehdot ja ateriat.

Loput tästä artikkelista opastavat sinua kortin luomisessa, muokkaamisessa ja esittämisessä käyttäjillesi.

Toiminnot
Hakutulosten toiminnot

Yllä on kuva Haku -sivulta, joka näyttää joitakin toimintoja, joita voit tehdä hakutuloksillasi. Yksi näistä toiminnoista on Tee kortti. Klikkaa tätä painiketta, niin sinut ohjataan korttilomakkeeseen, jossa voit aloittaa korttisi muokkaamisen.

Lomake antaa sinun muokata korttiasi seuraavilla tavoilla:

  1. Anna kortille nimi, jotta muistat, mistä kortti kertoo.
  2. Valitse Muokkaus, jonka haluat soveltaa tähän korttiin.
  3. Valitse aloituspuoli, jonka haluat käyttäjien näkevän ensin. Oletuksena se on kyseisen varaston alkuperäinen puoli.
  4. Valitse merkki, jonka haluat käyttää kortissa. Merkki antaa käyttäjille mahdollisuuden vertailla varastoja kokonaismittarin, kuten ympäristöystävällinen, perusteella.
  5. Lisää avainsanoja pilkuilla erotettuna, joita [Verkkokäyttäjät] (https://developer.mozilla.org/en-US/docs/Glossary/Crawler) käyttävät.
  6. Lisää otsikot ja kuvaukset kielillä, joilla haluat käyttäjän näkevän.
  7. Valitse yksi tai useampi kuva, jotka näytetään, kun käyttäjät klikkaavat Galleria-linkkiä.
  8. Klikkaa Tallenna-painiketta jatkaaksesi.

Kun olet tallentanut korttisi, sinut ohjataan korttisivullesi ja korttisi on nyt valmis jaettavaksi maailmalle.

Kortti
Kortti, jossa supistettu toimintovalikko

Yllä on kuva, joka näyttää kaikki kortillesi saatavilla olevat toiminnot:

  • Päivitä Päivittää korttisi asetukset.
  • Lisää WinkLinkseihin Lisää kortin WinkLinks-tilillesi.
  • Upota Näyttää, miten tämä kortti upotetaan Korttina verkkosivustollesi.
  • Käytä WordPressin kanssa Näyttää, miten käytät WordPress-laajennustamme upottaaksesi tämän kortin verkkosivustollesi.

Käymme joitakin näistä vaihtoehdoista tarkemmin alla.

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

Näin upotat korttisi sivustollesi:

  • Rivi 3 näyttää, miten Wink-tyylit upotetaan sivustollesi.
  • Rivit 6–9 näyttävät, miten käytät wink-content-loader Web-komponenttia ja kerrot sille, että haetaan vierashuonekortti koodillesi.
  • Rivi 11 näyttää, miten upotat Javascriptimme sivustollesi.
  • Rivi 13 näyttää, miten upotat wink-app-loader Web-komponentin ja kerrot sille, että haetaan sivutason asetuksesi.

Kehittäjät, jotka haluavat hallita kortteja, voivat siirtyä kohtaan Kehittäjät > API > Varasto.