Widgetin upotus sivustolle

Avaa hallinnassa Widget, valitse asetukset ja paina Copy code. Koodi näkyy myös kohdassa Embed code. Koodissa on kaksi osaa: paikka, johon palkki piirretään, ja skripti, joka lataa sen.

<div data-wholestay-widget></div>
<script src="https://wholestay.app/widget.js"
  data-property="oma-kohde"
  data-layout="horizontal"
  data-style="glass"
  data-color="#18181b"
  data-lang="en"
  data-fields="dates,guests"
  async></script>

• <div data-wholestay-widget></div> on paikka, johon hakupalkki ilmestyy. Saman sivun eri kohtiin voi lisätä useamman.
• <script> lataa palkin. data-property kertoo, mikä kohde on kyseessä. Se ei ole salainen.
• Kelluva nappi ei tarvitse paikkaa sivulla: pelkkä skripti riittää.
• Palkki piirretään omaan suojattuun kerrokseensa (Shadow DOM), joten sivuston tyylit eivät riko sitä.

app.wholestay.app

1. 1

   Lohkoeditori

   Lisää sivulle Mukautettu HTML -lohko (Custom HTML) siihen kohtaan, jossa palkin pitää näkyä, ja liitä koodi.

2. 2

   Elementor

   Raahaa HTML-elementti esimerkiksi etusivun hero-osioon ja liitä koodi. Elementorin Custom Code -kenttää ei tarvita.

3. 3

   Julkaise

   Päivitä sivu ja tarkista se puhelimella. Kapealla näytöllä palkki asettuu allekkain.

1. 1

   Code Embed

   Lisää sivulle Code Embed -elementti siihen kohtaan, jossa palkin pitää näkyä, ja liitä koodi.

2. 2

   Julkaise

   Julkaise sivusto uudelleen. Upotettu koodi vaatii maksullisen sivustopaketin.

Liitä koodi sivun HTML:ään kohtaan, jossa palkin pitää näkyä. Jos sivustoa ylläpitää sivustotoimittaja, lähetä tämä ohje ja koodisi heille. Asennamme koodin myös itse, jos annat pääsyn.