Jotta voit lisätä varauspainikkeen verkkosivuillesi, kopioi varaussivusi linkki varausjärjestelmästäsi ja liitä se sivustosi painikkeeseen, tai liitä varausjärjestelmän antama painikekoodi HTML- tai koodilohkoon. Kumpikin tapa vie muutaman minuutin, eikä kehittäjää tarvita. Alla ovat vaiheet WordPressille, Wixille, Squarespacelle, Shopifylle ja mille tahansa muulle sivustolle.
Tämä opas käy läpi molemmat tavat, kertoo, mihin painike kannattaa sijoittaa, jotta asiakkaat todella käyttävät sitä, ja miten sen voi testata. Esimerkit käyttävät TicketPa-palvelua, mutta vaiheet toimivat samalla tavalla useimmissa varausjärjestelmissä.
Kaksi tapaa lisätä varauspainike
| Tapa | Miten se toimii | Sopii parhaiten |
|---|---|---|
| Linkitä painike, joka sinulla jo on | Käytä sivustotyökalusi omaa painiketta ja aseta sen linkiksi varaussivusi | Mihin tahansa sivustotyökaluun, myös niihin, jotka rajoittavat omaa koodia |
| Liitä koodinpätkä | Liitä varausjärjestelmäsi painikekoodi HTML-lohkoon | Sivustoille, jotka sallivat oman HTML:n, kun haluat valmiin painikkeen |
Painikkeen linkittäminen on yksinkertaisinta ja toimii kaikkialla. Koodinpätkä antaa valmiiksi muotoillun painikkeen, ja joissakin varausjärjestelmissä se voi avata varaussivun ikkunaan sivustosi viereen.
Vaihe 1: Hanki varauslinkkisi tai painikekoodisi
Jokainen varausjärjestelmä antaa linkin varaussivullesi, ja moni antaa myös linkin jokaiselle aktiviteetille ja painikkeen koodinpätkän. TicketPa-palvelussa avaa sivu Share (Jaa). Siellä on:
- Varaussivusi: yksi linkki kaikkiin aktiviteetteihin, joita asiakkaat voivat varata. Käytä sitä päävalikossasi ja etusivullasi.
- Yksittäinen aktiviteetti: linkki suoraan yhden aktiviteetin kalenteriin. Käytä sitä kyseisen aktiviteetin sivulla ja sitä koskevissa julkaisuissa tai mainoksissa.
- Varaa nyt -painike: koodi, jonka liität verkkosivuillesi, varaussivusi korostusvärissä. Siitä on kaksi versiota:
- tavallinen painike, joka toimii kaikkialla, myös sähköposteissa
- painike, joka avaa varauksen ikkunaan sivustosi viereen tietokoneella
Kopioi tarvitsemasi linkki tai koodi.
Vaihe 2: Lisää se verkkosivuillesi
WordPress
Painikkeen linkittäminen: lisää lohkoeditorissa Painikkeet-lohko kohtaan, johon haluat painikkeen, kirjoita "Varaa nyt" ja liitä varauslinkkisi painikkeen linkkikenttään.
Koodinpätkän liittäminen: lisää Mukautettu HTML -lohko kohtaan, johon haluat painikkeen, ja liitä koodi. Esikatsele sivua nähdäksesi painikkeen.
Jos teemassasi on ylävalikko, lisää varauslinkkisi myös valikkokohdaksi kohdassa Ulkoasu, Valikot tai sivustoeditorin navigointilohkossa.
Wix
Painikkeen linkittäminen: lisää Painike (Button) Lisää elementtejä -paneelista, vaihda sen tekstiksi "Varaa nyt", avaa sitten sen linkkiasetukset ja valitse verkko-osoite. Liitä varauslinkkisi.
Wix sijoittaa oman koodin kehykseen, mikä voi estää painiketta avaamasta uutta ikkunaa. Wixissä painikkeen linkittäminen on varmempi valinta.
Squarespace
Painikkeen linkittäminen: muokkaa sivua, lisää Button-lohko, kirjoita "Varaa nyt" ja liitä varauslinkkisi sen linkiksi.
Koodinpätkän liittäminen: lisää Code-lohko ja liitä koodi. Skriptejä ajavat koodilohkot ovat käytössä vain osassa Squarespacen paketeista, joten jos koodinpätkä ei toimi omassasi, linkitä painike.
Shopify
Painikkeen linkittäminen: lisää tai muokkaa teemaeditorissa osiota, jossa on painike, kuten kuvabanneria, ja liitä varauslinkkisi painikkeen linkiksi. Lisää se valikkoosi kohdassa Verkkokauppa, Navigointi: avaa päävalikkosi ja lisää valikkokohta varauslinkilläsi.
Koodinpätkän liittäminen: lisää teemaeditorissa Mukautettu Liquid -osio (Custom Liquid) ja liitä koodi.
Mikä tahansa muu sivusto
Itse rakennetulla sivustolla tai työkaluissa, kuten Webflow, Framer tai Carrd, liitä koodinpätkä sivun HTML:ään tai työkalun upotus- tai HTML-elementtiin kohtaan, jossa painikkeen pitää näkyä. Jos et voi lisätä koodia, käytä mitä tahansa linkkiä tai painiketta ja osoita se varauslinkkiisi.
Mihin varauspainike kannattaa laittaa
Varauspainike toimii vain, jos asiakkaat näkevät sen, kun he ovat valmiita varaamaan:
- Jokaisen aktiviteettisivun yläosaan hinnan viereen, jotta asiakkaiden ei tarvitse vierittää.
- Päävalikkoosi viimeiseksi kohdaksi painikkeen näköisenä.
- Jokaisen aktiviteettisivun loppuun kuvauksen ja kuvien jälkeen.
- Etusivullesi ensimmäisen otsikon lähelle.
- Yhteystietosivullesi asiakkaille, jotka olivat lähettämässä viestiä vapaista paikoista.
Käytä painikkeen tekstinä "Varaa nyt" tai "Katso vapaat ajat". Asiakkaat tietävät, mitä molemmat tarkoittavat, ja molemmat alkavat siitä, mitä he haluavat tehdä.
Linkitä jokainen aktiviteetti sen omaan kalenteriin
Jos verkkosivuillasi on sivu jokaiselle aktiviteetille, linkitä kunkin sivun painike kyseiseen aktiviteettiin eikä yleiseen varaussivuusi. Asiakkaat päätyvät oikeaan kalenteriin ja säästävät yhden vaiheen, joten harvempi luovuttaa ennen varaamista.
TicketPa-palvelussa sivulla Share (Jaa) on linkki jokaiselle aktiviteetille. Käytä yleistä varaussivulinkkiä vain paikoissa, jotka kattavat kaiken, kuten päävalikossa ja etusivulla.
Testaa varauspainikkeesi
Ennen kuin kerrot kenellekään, testaa se kuten asiakas tekisi:
- Avaa verkkosivusi puhelimellasi ja napauta painiketta.
- Tarkista, että se vie oikealle sivulle, jossa on oikea aktiviteetti ja reaaliaikaiset ajat.
- Tee testivaraus tai mene maksuvaiheeseen asti.
- Toista tietokoneella. Jos painikkeesi avaa varauksen ikkunaan, tarkista, että se aukeaa ja että varaussivu aukeaa silti, jos selain estää ikkunat.
Käytä samaa linkkiä kaikkialla muualla
Varauslinkkisi toimii kaikkialla, missä asiakas voi napauttaa linkkiä, eikä vain verkkosivuillasi. Lisää se Googlen yritysprofiiliisi, Instagramin bioon ja WhatsApp-vastauksiisi. Oppaamme varauksista Instagramista, Googlesta ja WhatsAppista näyttää, mihin kukin kuuluu.
Näin TicketPa-painike toimii
TicketPa-painike on linkki, jossa on pieni skripti. Tietokoneella se avaa varaussivusi ikkunaan sivustosi viereen, joten asiakkaat pitävät verkkosivusi auki sen takana. Puhelimella, tai jos selain estää ikkunan, se avaa varaussivusi tavallisena linkkinä. Skripti ei seuraa kävijöitäsi, ja painike käyttää varaussivusi korostusväriä.
TicketPa on varausjärjestelmä kierroksille, kursseille ja aktiviteeteille, ja sen varaussivu toimii myös ilman verkkosivuja. Katso kaikki ominaisuudet tai oman toimialasi sivu, kuten kierrokset tai työpajat.



