Varaa verkossa -painike -widget lisää verkkosivustollesi painikkeen. Kun kävijä napsauttaa sitä, hän siirtyy Barberly-varaussivullesi ja varaa ajan. Painike sijoitetaan usein etusivulle, palvelusivulle tai sivuston ylä- tai alatunnisteeseen.
Luo uusi instanssi#
- Kirjaudu Barberly-tilillesi osoitteessa portal.barberly.com.
- Siirry kohtaan ValikkoSovelluksetKaikki Widgetit.
- Valitse Varaa verkossa -painike.
- Valitse Luo uusi instanssi.
- Anna instanssille nimi, esimerkiksi ”Etusivun painike”.
Asetukset#
- Painikkeen teksti
- Painikkeessa näkyvä teksti, esimerkiksi ”Varaa nyt” tai ”Varaa aika”.
- Varauksen URL-osoite
- Barberly-varaussivusi URL-osoite.
Tyylit#
- Taustan väri
- Painikkeen väri.
- Tekstin väri
- Painikkeen tekstin väri. Valitse väri, joka erottuu selvästi taustasta.
- Pehmuste
- Painikkeen sisäinen tila muodossa ylä/oikea/ala/vasen.
- Rajauksen säde
- Kuinka pyöristetyt kulmat ovat.
- Fontin paino
- Normaali, lihavoitu ja niin edelleen.
- Laatikon varjo
- Varjo painikkeen ympärillä.
Lisää painike verkkosivustollesi#
Esikatselu näyttää, miltä painike tulee näyttämään. Napsauta sitä ja tarkista, että se avaa varaussivusi.
- Kopioi koodi kohdasta Kopioi tämä koodi verkkosivustollesi.
- Liitä se verkkosivustosi HTML-koodiin siihen kohtaan, jossa painikkeen pitää näkyä.
- Tallenna ja julkaise verkkosivustosi.
Esimerkkikoodi:
<div id="8854691ef448cad2ae94bb4cc5b9a-container"></div>
<script src="https://widgets.barberly.com/barberly-widgets.js" data-business-id="house13" data-widget-id="button_8854691ef448cad2ae94bb4cc5b9a" data-container-id="8854691ef448cad2ae94bb4cc5b9a-container"></script>Ohjeet eri alustoille: WordPress, Wix ja Squarespace.
Useita instansseja#
Voit luoda lisää painikeinstansseja, esimerkiksi eri ulkoasulla sivuston eri osioihin. Toista yllä olevat vaiheet kohdassa Varaa verkossa -painike. Jokaisella instanssilla on oma integrointikoodinsa.
Päivitä julkaistu painike#
Avaa instanssi kohdassa ValikkoSovelluksetKaikki Widgetit, tee muutokset ja tallenna. Sivustosi painike päivittyy automaattisesti, joten sivuston koodia ei tarvitse muuttaa.