Mistä löydät

• BookUP.APP:n asetukset: Asetukset → BookUP.APP -sovellus → Ominaisuudet & Ulkoasu

• Tilin nimi (osoitteen osa): Asetukset → BookUP.APP -sovellus → Ominaisuudet & Ulkoasu → BookUP-tilin nimi (asiakaspalvelu asettaa)

• Resurssin suora varauslinkki: Asetukset → BookUP.Studio → Resurssit → resurssi → välilehti Nettivaraus → Nettivarauslinkki

Linkki vai upotus?

BookUP.APP:n saa nettisivuille kahdella tavalla:

• Linkki – lisäät sivulle painikkeen tai tekstilinkin, joka avaa BookUP.APP:n omaan ikkunaansa. Helpoin tapa, toimii kaikilla sivustoalustoilla.

• Upotus (iframe) – BookUP.APP näkyy osana omaa sivuasi, eikä asiakas poistu sivustoltasi.

Oma osoitteesi

BookUP.APP:n osoite on muotoa https://v2.bookup.app/b/TILI, jossa TILI on BookUP-tilisi nimi. Tilin nimi asetetaan käyttöönoton yhteydessä. Jos et tiedä sitä, kysy asiakaspalvelusta.

Uusi BookUP.APP (v3) toimii aina yrityksesi omalla, tilikohtaisella osoitteella (esim. varaa.yrityksesi.fi). Osoite sovitaan käyttöönoton yhteydessä, ja sen saat asiakaspalvelusta. Upota tai linkitä silloin tämä oma osoite samalla tavalla kuin alla.

Voit ohjata asiakkaan suoraan tiettyyn näkymään lisäämällä osoitteen perään näkymän nimen:

• /services – palveluiden ajanvaraus

• /spaces – tilavaraukset

• /groupfitness – ryhmäliikunta

• /courses – kurssit

• /fleaup – FleaUP-myyntipaikkojen varaus

• /webshop – verkkokauppa

Näkymä näkyy vain, jos kyseinen ominaisuus on käytössäsi. Helpoin tapa löytää oikea osoite: avaa BookUP.APP selaimessa, siirry haluamaasi näkymään ja kopioi osoite selaimen osoiteriviltä. Yksittäisen resurssin suora linkki löytyy resurssin Nettivaraus-välilehdeltä kohdasta Nettivarauslinkki.

Upotus iframena

Lisää sivullesi HTML-lohko (esim. WordPressin Mukautettu HTML tai Umbracon HTML-kenttä) ja liitä siihen alla oleva koodi. Vaihda TILI omaksi tilisi nimeksi ja tarvittaessa näkymä (esim. /services).

<iframe id="bookup-app" src="https://v2.bookup.app/b/TILI/services" title="Ajanvaraus" style="width:100%;height:600px;border:0;background:transparent;"></iframe>
<script>
var bookupLoaded = false;
window.addEventListener("message", function (e) {
  if (e.origin.indexOf("bookup.app") < 0) return;
  var data; try { data = JSON.parse(e.data); } catch (x) { return; }
  var frame = document.getElementById("bookup-app");
  if (data.height) frame.style.height = data.height + "px";
  if (data.tool === "scrolltop") {
    if (bookupLoaded) frame.scrollIntoView({ behavior: "smooth" });
    bookupLoaded = true;
  }
});
</script>

BookUP.APP tunnistaa itse olevansa upotettuna ja lähettää sivullesi korkeutensa, joten skripti venyttää kehyksen sisällön mittaiseksi eikä sivulle tule kahta vierityspalkkia. Kun asiakas siirtyy vaiheesta toiseen, skripti vierittää kehyksen alun näkyviin (ei kuitenkaan sivun latautuessa).

Jos sivustosi on tumma, lisää osoitteen perään ?dark=true, jolloin BookUP.APP käyttää tummaa ulkoasua.

Vanhoissa ohjeissa osoitteen perään lisättiin ?iframe=true. Sitä ei tarvita: BookUP.APP tunnistaa upotuksen itse, ja parametri vain muutti aiemmin näkymän tyyliä.

Muistilista

• Linkki on helpoin tapa, upotus pitää asiakkaan omalla sivullasi.

• Vaihda koodiin oma tilisi nimi – muuten upotus ei näytä mitään.

• Osa toiminnoista, kuten kurssin verkkomaksu, voi avautua upotuksesta uuteen ikkunaan.

• Jos upotus näyttää tyhjää, tarkista osoite avaamalla se ensin suoraan selaimessa.