Vefþættir

Vefþættirer staðall sem gerir þér kleift að samþætta alla Javascript eiginleika í vefsíðuna þína án þess að kunna að forrita. Þökk sé þessari flottu tækni geturðu fellt inn ferðabirgðir frá Wink með mjög litlum fyrirhöfn. Þessi grein leiðir þig í gegnum safn okkar af vefíhlutum og sýnir þér hvernig á að nota þá.

Fella inn Wink

Það eru þrír hlutir sem þú verður að hafa með á hverri síðu þar sem þú vilt birta einn af vefþáttum okkar.

Hafðu stílblaðið okkar með.
Innifalið Javascript okkar.
Hafðu með forritahleðslutækið okkar.

Stílblað

Settu CSS stílana okkar inn í hausinn á skjalinu þínu.

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
</html>

Javascript

Settu Javascript-kóðann okkar neðst í skjalið þitt. (Við mælum með að þú setjir strax fyrir ofan lokamerkinguna).

<html>
  <body>
    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>
  </body>
</html>

Síðan þín er nú tilbúin og getur birt vefþætti okkar.

Íhlutir

Lestu um íhlutasafnið okkar hér að neðan.

Forritshleðslutæki

Hleðslutækið ber ábyrgð á að viðhalda stöðu og stjórna samskiptum milli íhluta okkar. (Settu það inn fyrir neðan Javascript-kóðann okkar).

<html>
  <body>
    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="YOUR CUSTOMIZATION ID GOES HERE"
    ></wink-app-loader>
  </body>
</html>

Innihaldshleðslutæki

Innihaldshleðslutækið er kjarninn í vefþáttasafni okkar. Það sér um að birta birgðir þínar (kort, töflur, kort).

Tiltækir eiginleikar:

skipulag
auðkenni
flokka

Eiginleikinnsorter aðeins í boði þegar útlitið erRANKEDog þú vilt ekki nota núverandi raðaða rist. Í þessum tilfellum skaltu skilja eftiridtómt.

Tiltækar gerðir af útliti:

AD_BANNER
MAP
HOTEL
GUEST_ROOM
MEETING_ROOM
SPA
RESTAURANT
ACTIVITY
ATTRACTION
PLACE
ADD_ON
LIST
SEARCH
RANKED

Tiltækar flokkunartegundir:

MEMBER
PRICE_LOW_TO_HIGH
PRICE_HIGH_TO_LOW
PRICE
POPULARITY
ECO
EXPERIENCE
PERK
LOYALTY
PACKAGE

<html>
  <body>
    <wink-content-loader
       layout="GUEST_ROOM"
       id="2de7ee9c-61c9-11ef-9722-42004e494300"
    ></wink-content-loader>
  </body>
</html>

Hægt er að finna sýnishorn fyrirspil,grindurogkort.

Leita

Leit virkar vel með einu af röðunartöflunum þínum. Það gerir notendum kleift að leita að hóteli og áfangastað og töfluna uppfærist í samræmi við leitarniðurstöður þeirra.

<html>
  <body>
    <wink-lookup></wink-lookup>
  </body>
</html>

Með því að smella á íhlutinn hér að ofan opnast glugga sem gerir þér kleift að slá inn áfangastaðinn eða hótelið sem þú ert að leita að.

Ferðaáætlun

Hnappurinn fyrir ferðaáætlun sýnir núverandi ferðaáætlun á hnappinum. Þegar þú smellir á hann birtist allur ferðaáætlunarvalið sem glugga.

<html>
  <body>
    <wink-itinerary></wink-itinerary>
  </body>
</html>

Vefþáttur ferðaáætlunar

Með því að smella á hnappinn hér að ofan opnast glugga sem gerir þér kleift að uppfæra ferðaáætlun þína.

Leita

Leit er táknmynd í ferðaáætlunarvalinu. Þegar þú smellir á hana birtist allur ferðaáætlunarvalið sem glugga.

<html>
  <body>
    <wink-search></wink-search>
  </body>
</html>

Með því að smella á hnappinn hér að ofan opnast glugga sem gerir þér kleift að uppfæra ferðaáætlun þína.

Ferðaáætlunarform

Ferðaáætlunarhlutinn sýnir ferðaáætlunarform sem notendur geta haft samskipti við.

<html>
  <body>
    <wink-itinerary-form></wink-itinerary-form>
  </body>
</html>

Með því að breyta ferðaáætluninni, í einhverjum af ferðaáætlunarþáttum okkar, virkjast ferðaáætlunaruppfærslur fyrir allar birgðir sem þú hefur nú þegar birtar á síðunni.

Reikningur

Með reikningshnappinum geturðu bætt við Wink-auðkenningu á síðuna þína.

<html>
  <body>
    <wink-account></wink-account>
  </body>
</html>

Ef smellt er á hnappinn þegar notandinn er ekki auðkenndur verður hann sendur áfram til auðkenningar. Þegar notandinn hefur verið auðkenndur birtist prófíltákn hans.

Þegar þú smellir á hnappinn opnast fellivalmynd fyrir hvern notanda.

Innfella TripPay

Það eru tveir hlutir sem þú þarft að hafa með á hverri síðu þar sem þú vilt nota vefþáttinn fyrir TripPay greiðslu.

Hafðu stílblaðið okkar með.
Innifalið Javascript okkar.

Stílblað

Settu CSS stílana okkar inn í hausinn á skjalinu þínu.

<html>
  <head>
    <link rel="stylesheet" href="https://elements.trippay.io/styles.css"></link>
  </head>
</html>

Javascript

Settu Javascript-kóðann okkar neðst í skjalið þitt. (Við mælum með að þú setjir strax fyrir ofan lokamerkinguna).

<html>
  <body>
    <script src="https://elements.trippay.io/elements.js" type="module" defer></script>
  </body>
</html>

Síðan þín er nú tilbúin og getur birt vefþætti okkar.

Íhlutir

Greiðsla

Greiðsluþátturinn gerir þér kleift að láta TripPay vita að ferðalangur vilji kaupa eitthvað og reglurnar og verðið fyrir þessar vörur.

Það er einn nauðsynlegur eiginleiki fyrir búnaðinn:

idAuðkenni bókunarsamningsins sem þú vilt að verði undirritaður.

<html>
  <body>
    <trip-pay id="<INSERT_BOOKING_CONTRACT_ID>"></trip-pay>
  </body>
</html>

:::athugið Til að læra hvernig á að búa til bókunarsamninginnid, lestu leiðbeiningarnar:Samþætting við TripPay. :::

Græjan undirbýr samninginn til framkvæmdar og birtir greiðsluupplýsingar(Mynd 1)notandanum til að ljúka bókuninni.