Kuinka voin lisätä nettiajanvarauksen verkkosivuilleni? (Kelluva Varaa nyt -painike)

Jos lisäät nettiajanvarauksen itse verkkosivuillesi tai verkkosivujesi ylläpitäjä tekee sen, alla on ohjeet kuinka se onnistuu.

Jos haluat että me lisäämme sen puolestasi, ota yhteyttä meihin tuki@phorest.fi

On olemassa kolme eri tapaa, miten voit lisätä nettiajanvarauksen verkkosivullesi:

  1. Varaa nyt -painike
  2. Suora linkki, joka avaa nettiajanvarauksen uuteen ponnahdusikkunaan
  3. iframe (ei suositeltu)

 

1. Varaa nyt -painike ja nettiajanvarauksen lisääminen nettisivuille

Painike tulisi lisätä jokaiselle verkkosivustosi sivulle. Seuraa näitä ohjeita tehdäksesi sen:

Lisää seuraava koodi jokaisen sivun 'head' osioon.

<script src="https://booking-widget.phorestcdn.com/obwidget.bundle.js">
</script>
<script>window.widget = new OBWidget('laitasalonginIDtähän')
</script>

Salongin ID:n löytää omasta nettiajanvaraus URL:stä (sen viimeinen osa), jonka voi kopioida Phorest -järjestelmän Online asetuksista.
(esimerkki: https://phorest.com/book/salons/salonginnimi, tässä ID on salonginnimi)

 

If you are using a popular Web Builder CMS, below are some step-by-step instructions on where to insert the code.

Squarespace

Log in to your Squarespace account, then hover over your website under the Websites tab and click Edit Site.

mceclip4.png

Click Settings from the left-hand sidebar > Advanced > Code Injection, then enter the floating book now script into the Header and Footer sections and click Save.

mceclip5.png

Wix

Kirjaudu sisään Wix-tilillesi ja seuraa näitä ohjeita:

  1. Klikkaa Settings vasemmassa laidassa olevasta valikosta

  2. Klikkaa Tracking Tools (myös vasemmassa laidassa)

  3. Klikkaa New Tool -> Custom 

  4. Lisää seuraava koodi kohtaan, jossa lukee "Paste the code snippet here"

<script src="https://booking-widget.phorestcdn.com/obwidget.bundle.js"></script>
<script>
window.widget = new OBWidget('laitasalonginIDtähän')
</script>

Salongin ID:n löytää omasta nettiajanvaraus URL:stä (sen viimeinen osa), jonka voi kopioida Phorest -järjestelmän Online asetuksista.

(esimerkki: https://phorest.com/book/salons/salonginnimi, tässä ID on salonginnimi) 

mceclip6.png

mceclip7.png

WordPress

Lisätäksesi Varaa nyt -painikkeen WordPress nettisivuille tarvitset lisäosan 'Insert Headers and Footers'

1597234258133-Screenshot_2020-08-12_at_13.36.51.jpg

  1.  Valitse Lisäosat valikosta sivun vasemmassa laidassa
  2. Paina Lisää uusi  
  3. Etsi lisäosa Insert Header and Footers ja asenna se
  4. Sitten klikkaa Activate
  5. Mene Asetukset ja sieltä Insert Headers and Footers
  6. Lisää seuraava koodi jokaisen sivun 'head' osioon.

<script src="https://booking-widget.phorestcdn.com/obwidget.bundle.js"></script>
<script>
window.widget = new OBWidget('laitasalonginIDtähän')
</script>

Salongin ID:n löytää omasta nettiajanvaraus URL:stä (sen viimeinen osa), jonka voi kopioida Phorest -järjestelmän Online asetuksista.

(esimerkki: https://phorest.com/book/salons/salonginnimi, tässä ID on salonginnimi) 

Weebly
Kirjaudu sisään Weebly-tilillesi ja seuraa näitä ohjeita: 
  1. Klikkaa Asetukset valikosta sivun yläreunassa
  2. Klikkaa SEO vasemmassa laidassa olevasta valikosta
  3. Lisää seuraava koodi Otsikkokoodi laatikkoon
<script src="https://booking-widget.phorestcdn.com/obwidget.bundle.js"></script>
<script>
window.widget = new OBWidget('laitasalonginIDtähän')
</script>Salongin ID:n löytää omasta nettiajanvaraus URL:stä (sen viimeinen osa), jonka voi kopioida Phorest -järjestelmän Online asetuksista.(esimerkki: https://phorest.com/book/salons/salonginnimi, tässä ID on salonginnimi).

 

Linkki ajanvaraukseen

Varaa nyt -painikkeen lisäämisen jälkeen voit lisätä muihin verkkosivusi osioihin, kuten päävalikkoon linkin, joka avaa ajanvarauksen. Käytä tähän seuraavanlaista osoitemuotoa:

www.yourwebsite.com/#onlinebookings

Tässä esimerkki:
https://www.stooli.fi/#onlinebookings

 

Klikkaa alta saadaksesi lisäohjeita Varaa nyt -painikkeen lisäämiseen eri verkkosivujen palveluntarjoajien alustoilla:

Wordpress
Wix
Weebly

 

2. Linkki uuteen ponnahdusikkunaan

Linkki, joka avaa nettiajanvarauksen uuteen ponnahdusikkunaan, on seuraavaanlainen:

https://phorest.com/book/salons/kristipopupturku

Löydät linkkisi, kun menet Phorest järjestelmästäsi kohtaan Hallinta - Asetukset - Online.

 

3. Iframen käyttö

Emme suosittele iframen käyttöä nettisivuilla muutamista syistä, mutta pääasiassa koska Chrome ja Safari saattavat merkitä nämä sivut suojaamattomiksi heinäkuusta 2018 alkaen ja asiakkaasi eivät voi enää varata aikoja netistä. Toinen syy on että 'kelluvien' Varaa nyt -painikkeiden on todettu saavan enemmän konversioita.

Mikäli kuitenkin haluat lisätä nettiajanvarauksen sivuillesi iframella, käytä tätä alla olevaa koodia
<iframe src="https://phorest.com/book/ salons/SalonginIDtähän" height="1000px" width="100%" frameBorder="0"></iframe>

 

Iframen käyttö (mobiilinäkymä)

Jotkut asiakkaistamme pitävät enemmän nettiajanvarausten mobiiliversiosta, joten jos haluat mielummin näyttää verkkosivullasi mobiilinäkymän iframessa, laita iframe sellaiseen osioon, jonka leveys on maksimissaan 765px.

Oliko tämä artikkeli hyödyllinen?
6/13 koki tästä olevan apua