Squarespace

Squarespace podporuje vlastný HTML a JavaScript, čo znamená, že môžete vložiť akýkoľvek webový komponent Wink priamo na svoju stránku bez použitia pluginu. Tento návod vám ukáže, ako načítať skripty Wink na celej stránke a potom umiestniť komponenty na jednotlivé stránky.

Načítanie skriptov Wink na celej stránke

Pridanie skriptov do globálneho pätičky a hlavičky vašej stránky znamená, že Wink bude dostupný na každej stránke bez opakovania nastavenia.

V editore Squarespace prejdite na Settings → Advanced → Code Injection.

Do poľa Header pridajte štýlový súbor:

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

Do poľa Footer pridajte skript a načítač aplikácie (nahraďte YOUR_CLIENT_ID vaším Wink Client ID):

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

Kliknite na Save.

Pridanie komponentu na stránku

Keď sú skripty načítané globálne, môžete na ľubovoľnú stránku vložiť akýkoľvek komponent Wink pomocou Code Block.

Otvorte stránku, ktorú chcete upraviť.
Kliknite na Edit a pridajte nový Code blok tam, kde chcete, aby sa komponent zobrazil.

Vložte HTML komponentu, napríklad content loader:

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

Kliknite na Apply a potom na Save.

Dostupné komponenty

Komponent	HTML tag	Účel
Content loader	`<wink-content-loader>`	Zobrazenie hotelových kariet, mriežok, máp
Lookup	`<wink-lookup>`	Vyhľadávací panel pre destinácie
Search button	`<wink-search-button>`	Otvorenie výberu itinerára
Account button	`<wink-account-button>`	Prihlásenie / používateľské menu
Itinerary button	`<wink-itinerary-button>`	Zobrazenie aktuálneho itinerára
Itinerary picker	`<wink-itinerary-picker>`	Kompletný formulár itinerára
Shopping cart	`<wink-shopping-cart-button>`	Tlačidlo so súhrnom košíka

Pozrite si Web Components pre úplný zoznam atribútov každého komponentu.