Squarespace

Squarespace podržava prilagođeni HTML i JavaScript, što znači da možete direktno ugraditi bilo koji Wink web komponent u vaš sajt bez dodatka. Ovaj vodič pokazuje kako da učitate Wink skripte na celom sajtu, a zatim postavite komponente na pojedinačne stranice.

Učitajte Wink skripte na celom sajtu

Dodavanjem skripti u globalni footer i header sajta, Wink je dostupan na svakoj stranici bez ponavljanja podešavanja.

U Squarespace editoru, idite na Settings → Advanced → Code Injection.

U polje Header dodajte stilsku datoteku:

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

U polje Footer dodajte skriptu i učitavač aplikacije (zamenite YOUR_CLIENT_ID sa vašim Wink Client ID-jem):

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

Kliknite Save.

Dodajte komponentu na stranicu

Kada su skripte učitane globalno, možete ubaciti bilo koju Wink komponentu na bilo koju stranicu koristeći Code Block.

Otvorite stranicu koju želite da izmenite.
Kliknite Edit i dodajte novi Code blok na mesto gde želite da se komponenta pojavi.

Nalepite HTML komponente, na primer content loader:

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

Kliknite Apply, zatim Save.

Dostupne komponente

Komponenta	HTML tag	Svrha
Content loader	`<wink-content-loader>`	Prikaz hotelskih kartica, mreža, mapa
Lookup	`<wink-lookup>`	Pretraživač destinacija
Search button	`<wink-search-button>`	Otvaranje izbora itinerera
Account button	`<wink-account-button>`	Prijava / korisnički meni
Itinerary button	`<wink-itinerary-button>`	Prikaz trenutnog itinerera
Itinerary picker	`<wink-itinerary-picker>`	Kompletan formular itinerera
Shopping cart	`<wink-shopping-cart-button>`	Dugme za pregled korpe

Pogledajte Web Components za kompletnu referencu atributa za svaku komponentu.