Sulautettu varaussivu -widget sijoittaa koko Barberly-varaussivusi verkkosivustosi sivulle iframe-kehykseen. Asiakkaat tekevät koko varauksen ilman, että heidät ohjataan toiselle sivustolle. Voit käyttää sitä erillisellä varaussivulla tai lisätä sen etusivulle, palvelusivuille tai yhteystietosivulle.
Luo uusi instanssi#
- Kirjaudu Barberly-tilillesi osoitteessa portal.barberly.com.
- Siirry kohtaan ValikkoSovelluksetKaikki Widgetit.
- Valitse Sulautettu varaussivu.
- Valitse Luo uusi instanssi.
- Anna instanssille nimi, esimerkiksi ”Päävaraussivu”.
Asetukset#
- Varauksen URL-osoite
- Barberly-varaussivusi URL-osoite.
- Korkeus
- Sulautetun sivun korkeus, esimerkiksi ”100%” täydelle korkeudelle tai pikseliarvo, kuten ”600px”.
Tyylit#
- Rajauksen säde
- Kuinka pyöristetyt kulmat ovat.
- Laatikon varjo
- Varjo widgetin ympärillä.
Sulautettu sivu mukautuu näytön kokoon. Tietokoneella näkyy koko varausnäkymä, ja mobiilissa näkymä sovittuu pienemmälle näytölle.
Lisää sivu verkkosivustollesi#
Esikatselu näyttää, miltä sulautettu sivu tulee näyttämään. Käy varaus läpi ja tarkista, että kaikki toimii.
- Kopioi koodi kohdasta Kopioi tämä koodi verkkosivustollesi.
- Liitä se verkkosivustosi HTML-koodiin siihen kohtaan, jossa varaussivun pitää näkyä.
- Tallenna ja julkaise verkkosivustosi.
Esimerkkikoodi:
<div id="262b1c5d48b64c16a9786cd8ebbbecd3-container"></div>
<script src="https://widgets.barberly.com/barberly-widgets.js" data-business-id="house13" data-widget-id="embed_262b1c5d48b64c16a9786cd8ebbbecd3" data-container-id="262b1c5d48b64c16a9786cd8ebbbecd3-container"></script>Ohjeet eri alustoille: WordPress, Wix ja Squarespace.
Useita instansseja#
Voit luoda sulautetusta sivusta lisää instansseja sivuston eri osioihin. Toista yllä olevat vaiheet kohdassa Sulautettu varaussivu. Jokaisella instanssilla on oma integrointikoodinsa.
Päivitä julkaistu sulautettu sivu#
Avaa instanssi kohdassa ValikkoSovelluksetKaikki Widgetit, tee muutokset ja tallenna. Sivustosi sulautettu sivu päivittyy automaattisesti, joten sivuston koodia ei tarvitse muuttaa.
Jos sivu ei näy oikein#
- Varmista, että säilö on tarpeeksi leveä ja korkea varausnäkymälle.
- Tarkista, onko sivustosi tyyleissä CSS-ristiriitoja.
- Tarkista, että varauksen URL-osoite on oikein.
- Varmista, ettei sivustosi sisällön suojauskäytäntö (CSP) estä iframe-kehystä.