HubSpot CMS

HubSpot CMS podpira prilagojene HTML module in kodo za glavo/nogo po celotni strani, kar omogoča enostavno vdelavo Wink komponent na marketinške strani in pristajalne strani.

Naložite Wink skripte po celotni strani

V HubSpotu pojdite na Marketing → Datoteke in predloge → Orodja za oblikovanje.
Odprite aktivno temo main.css ali uporabite globalne nastavitve vsebine.
Alternativno pojdite na Nastavitve → Spletna stran → Strani → Prilagojena koda.

V polje Head HTML dodajte slogovno datoteko:

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

V polje Footer HTML dodajte skripto in nalagalnik aplikacije (zamenjajte YOUR_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>

Shrani in objavi.

Dodajte komponento preko prilagojenega HTML modula

V Orodjih za oblikovanje ustvarite nov modul tipa Rich Text ali HTML.

V privzeti vsebini modula prilepite HTML komponento:

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

Shrani modul in ga povlecite v katerokoli predlogo strani ali stran z urejevalnikom strani.

Dodajte komponento neposredno v urejevalnik strani

Če ne želite ustvarjati modula, lahko uporabite Custom HTML razdelek v urejevalniku z vlečenjem in spuščanjem:

Odprite stran v HubSpot urejevalniku strani.
Kliknite Dodaj in izberite razdelek Custom HTML ali Embed.
Prilepite oznako komponente v HTML polje.
Kliknite Uporabi in objavite stran.

Na voljo komponente

Komponenta	HTML oznaka	Namen
Naloževalnik vsebine	`<wink-content-loader>`	Prikaz hotelskih kartic, mrež, zemljevidov
Iskalnik	`<wink-lookup>`	Iskalna vrstica za destinacije
Gumb za iskanje	`<wink-search-button>`	Odpri izbirnik poti
Gumb za račun	`<wink-account-button>`	Prijava / uporabniški meni
Gumb za potovanje	`<wink-itinerary-button>`	Prikaži trenutno potovanje
Izbirnik poti	`<wink-itinerary-picker>`	Celoten obrazec poti
Nakupovalna košarica	`<wink-shopping-cart-button>`	Gumb s povzetkom košarice

Oglejte si Web Components za celoten seznam atributov.