Squarespace

Squarespace atbalsta pielāgotu HTML un JavaScript, kas nozīmē, ka vari tieši savā vietnē iegult jebkuru Wink tīmekļa komponentu bez spraudņa. Šī rokasgrāmata parāda, kā ielādēt Wink skriptus visā vietnē un pēc tam izvietot komponentus atsevišķās lapās.

Ielādēt Wink skriptus visā vietnē

Pievienojot skriptus vietnes globālajā kājenē un galvenē, Wink ir pieejams katrā lapā bez atkārtotas iestatīšanas.

Squarespace redaktorā dodies uz Settings → Advanced → Code Injection.

Laukā Header pievieno stila lapu:

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

Laukā Footer pievieno skriptu un lietotnes ielādētāju (aizvieto YOUR_CLIENT_ID ar savu Wink klienta ID):

<script src="https://elements.wink.travel/elements.js" type="module" defer></script>
<wink-app-loader client-id="YOUR_CLIENT_ID"></wink-app-loader>

Noklikšķini uz Save.

Pievienot komponentu lapai

Kad skripti ir ielādēti globāli, vari ievietot jebkuru Wink komponentu jebkurā lapā, izmantojot Code Block.

Atver lapu, kuru vēlies rediģēt.
Noklikšķini uz Edit un pievieno jaunu Code bloku tur, kur vēlies, lai parādās komponents.

Ielīmē komponenta HTML, piemēram, satura ielādētāju:

<wink-content-loader
  layout="HOTEL"
  id="YOUR_LAYOUT_ID"
></wink-content-loader>

Noklikšķini uz Apply, pēc tam uz Save.

Pieejamie komponenti

Komponents	HTML tags	Mērķis
Satura ielādētājs	`<wink-content-loader>`	Rāda viesnīcu kartītes, režģus, kartes
Meklēšana	`<wink-lookup>`	Meklēšanas josla galamērķiem
Meklēšanas poga	`<wink-search-button>`	Atver maršruta izvēlētāju
Konta poga	`<wink-account-button>`	Pieslēgšanās / lietotāja izvēlne
Maršruta poga	`<wink-itinerary-button>`	Rāda pašreizējo maršrutu
Maršruta izvēlētājs	`<wink-itinerary-picker>`	Pilns maršruta veidlapa
Iepirkumu grozs	`<wink-shopping-cart-button>`	Groza kopsavilkuma poga

Skatīt Web Components pilnu atribūtu atsauci katram komponentam.