Ohjaa verkkosivujesi kävijät suoraan varaamaan. Näytä vapaat tuntisi ruudussa verkkosivuillasi tai lisää sivuille painike, joka avaa Hopoti-sivusi. Tätä varten verkkosivuillesi pitää voida lisätä HTML-koodia.
Ennen kuin aloitat
Etsi Hopoti-sivusi linkki: valitse hallintavalikon yläosasta Asiakassivut ja kopioi osoite selaimesi osoiteriviltä, esimerkiksi https://hopoti.com/stable/HopotiHorizonStables. Osoitteen viimeinen osa, tässä HopotiHorizonStables, on Hopoti-sivusi nimi.
Näytä vapaat tuntisi verkkosivuillasi
Kopioi alla oleva koodi.
Korvaa TALLI Hopoti-sivusi nimellä, esimerkiksi HopotiHorizonStables.
Muuta halutessasi koodin asetuksia (katso lista alla).
Liitä koodi verkkosivujesi siihen kohtaan, jossa tuntien pitää näkyä. Kohtaan pitää voida lisätä HTML-koodia. Julkaise sitten sivu.
Verkkosivuillasi näkyvät nyt vapaat tuntisi niin monen päivän ajalta kuin valitsit.
<iframe src="https://hopoti.com/fi/stable/TALLI/embed/opencourses?days=7&lang=fi&height=300" allowtransparency="true" frameborder="0" scrolling="no" style="height:300px;width:100%;border: 0px none transparent;"></iframe>
Voit muuttaa koodissa näitä asetuksia:
days=7: kuinka monen päivän päähän ruutu näyttää vapaat tunnit.
lang=fi: ruudun kieli, fi suomeksi tai en englanniksi.
height=300 ja height:300px: ruudun korkeus pikseleinä. Käytä molemmissa kohdissa samaa lukua, vähintään 250.
width:100%: ruudun leveys pikseleinä tai prosentteina. 100% sovittaa ruudun sivullasi olevaan tilaan.
Lisää varauspainike
Varauspainike avaa Hopoti-sivusi uudelle välilehdelle, jossa kävijät voivat varata. Valitse yksinkertainen painike, jossa on Hopoti-logo, tai suurempi kuvapainike, jossa on valokuva.
Kopioi haluamasi painikkeen koodi.
Korvaa OMA-HOPOTI-SIVUN-LINKKI Hopoti-sivusi linkillä, esimerkiksi https://hopoti.com/stable/HopotiHorizonStables.
Liitä koodi verkkosivuillesi ja julkaise sivu.
Painike näkyy nyt verkkosivuillasi ja avaa Hopoti-sivusi.
Yksinkertainen painike
Painike, jossa on Hopoti-logo ja joka sopii mihin tahansa kohtaan verkkosivuillasi.
<a href="OMA-HOPOTI-SIVUN-LINKKI" target="_blank" rel="noopener">
<img src="https://hopoti.com/ui-images/snippets/hopoti-book-lessons.png" alt="Visit Hopoti" style="display:block;max-width:100%;height:auto;border:0;" />
</a>
Kuvapainike
Suurempi, enintään 600 pikseliä leveä painike, jossa on valokuva ja teksti Book our lessons from hopoti.com.
<a href="OMA-HOPOTI-SIVUN-LINKKI" target="_blank" rel="noopener" style="display:inline-block;width: auto;height:auto;max-width:600px;border:0;">
<img src="https://hopoti.com/ui-images/email/huso-1-600.jpg" alt="Visit Hopoti" style="display:block;max-width:100%;height:auto;border:0;border-top-left-radius:15px;border-top-right-radius:15px;" />
<span style="display:inline-flex;width:100%;align-items:center;gap:15px;background:#066b93;border-bottom-left-radius:15px;border-bottom-right-radius:15px;">
<img src="https://hopoti.com/ui-images/email/hopoti-logo-email.png" alt="Hopoti logo" style="display:block;max-width:150px;height:auto;margin:10px;" />
<span style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;line-height:1;">Book our lessons from <u>hopoti.com</u></span>
</span>
</a>
Jos ruutu tai painike ei toimi
Tarkista nämä tässä järjestyksessä:
Ruutu on tyhjä tai näyttää virheen: tarkista, että korvasit kohdan TALLI Hopoti-sivusi nimellä ja kirjoitit nimen täsmälleen samoin kuin sivusi linkissä.
Ruudussa ei näy tunteja: valitsemillesi päiville ei ole vapaita tunteja. Suurenna days-arvoa.
Ruutu näkyy vain osittain: käytä molemmissa kohdissa samaa korkeutta, vähintään 250.
Painike avaa väärän sivun: tarkista, että korvasit kohdan OMA-HOPOTI-SIVUN-LINKKI Hopoti-sivusi koko linkillä, joka alkaa https://.
Toimi ennen, mutta on lakannut toimimasta: jos yrityksesi nimi on muuttunut, myös Hopoti-sivusi linkki on muuttunut, eivätkä vanhat linkit enää toimi. Päivitä koodeihin uusi sivun nimi ja linkki tai laita meille viestiä, niin palautamme vanhan linkkisi käyttöön. Katso ohje Päivitä yrityksen tiedot, aikavyöhyke ja valuutta.
Eikö ongelma ratkennut? Laita meille viestiä chatissa ja kerro verkkosivujesi osoite, Hopoti-sivusi linkki ja koodi, jonka liitit.