Sådan opretter du en widget

Oversigt

TicketingHubs bookingwidget er et JavaScript-værktøj, der integreres på websites, så kunder kan booke produkter direkte. Du opretter den i kontrolpanelet, konfigurerer den sektion for sektion og indsætter et lille kodestykke på dit website.

Understøttede browsere

Safari 16.4+, Chrome 111+, Firefox 128+.

Gå til Widgets i kontrolpanelet
Klik på Ny widget
Giv widgetten et navn, vælg de produkter, den skal sælge, og klik på Opret widget

Du kommer til widgettens indstillingsside, hvor resten konfigureres. I venstre side findes indstillingerne, som er grupperet i sektioner. I højre side vises en liveforhåndsvisning af widgetten, der opdateres, efterhånden som du foretager ændringer.

Hvad du sælger

Vælg de produkter, pakker og gavekort, widgetten tilbyder, medtag ekstraudstyr (alt eller et udvalg, du selv vælger), og beslut, om kunderne skal kunne købe produkterne som gavekort eller indløse gavekort i widgetten.

Bookingforløb

Vælg, hvordan kunderne bevæger sig gennem widgetten: Billetter først (vælg billetter og derefter dato og tidspunkt), Arrangement først (gennemse en kalender og vælg derefter, hvad der skal bookes) eller Kun indløsning af gavekort. Du kan også angive standardvisningen for kalenderen og bede kunderne om at indtaste deres e-mailadresse to gange for at undgå tastefejl.

Salgsregler

Styr, hvornår og hvad widgetten sælger: datoen og tidspunktet, hvor salget starter, den dato kalenderen åbnes på, hvornår den resterende kapacitet for et tidspunkt skal vises, og hvilke valutaer kunderne kan betale i. Hvis den første uge eller måned, kalenderen viser, ikke indeholder noget, der kan bookes, går kalenderen frem og åbner på den første dato, hvor der er noget at booke.

Udseende

Tilføj brugerdefineret CSS for at finjustere widgettens udseende, så den passer til dit brand.

Analyse

Forbind Google Analytics eller Google Tag Manager for at følge, hvordan besøgende bruger din widget.

Avanceret

Send kunderne til en valgfri side efter købet, og angiv den URL-parameter, dine forhandlere bruger, så deres bookinger kan henføres til dem.

Forhåndsvisning, udgivelse og installation

Ændringer, du foretager, gemmes som kladde i forhold til en liveforhåndsvisning – klik på Opdater forhåndsvisning for at se dem til højre uden at påvirke din livewidget. Når du er tilfreds, skal du klikke på Udgiv for at gøre ændringerne live eller på Annuller for at kassere kladden.

Hvis du vil placere widgetten på dit website, skal du åbne Installationsvejledning: Kopiér script-tagget ind på din side, vælg derefter mellem den Indlejrede widget (vises direkte i sidens indhold) og Modal/pop-up-widgetten (åbnes som et overlay fra en knap), og indsæt det tilsvarende kodestykke.

Sådan ruller widgetten på din side

Når en kunde går videre til næste trin, ruller widgetten tilbage til toppen af bookingformularen, så en kunde, der har rullet ned gennem en lang liste med billetter, ikke lander midt på den næste side. Hvis du har placeret widgetten i et panel, som du selv har oprettet, og som kan rulles, er det panelet, der bevæger sig, og din side bevæger sig kun også, når selve panelet er rullet ud af syne. Widgetten gør dette, når formularens top er rullet ud af syne, og når formularen rækker ud over skærmens nederste kant, samtidig med at der er god plads over den. En formular, der allerede passer på skærmen, flyttes ikke, og widgetten giver plads til en header, der er fastgjort øverst på din side.

Hvis dette ikke passer til dit layout, kan du forhindre siden i at bevæge sig ved at tilføje "scrollOnStepChange": false til den widgetkode, du indsatte:

<div id="embed_widget" data-th-embed data-th-config='{"widgetId":"YOUR-WIDGET-ID","scrollOnStepChange":false}'></div>

Hvis din header skjules, når besøgende ruller ned, og vises igen, når de ruller op, kan widgetten ikke måle den, og formularens top kan ende med at ligge bag den. I stedet for at deaktivere rulningen kan du angive headerens højde i pixels for widgetten:

<div id="embed_widget" data-th-embed data-th-config='{"widgetId":"YOUR-WIDGET-ID","scrollOffset":80}'></div>

Hvis du bruger den klassiske widgeteditor, kan du duplikere en widget i stedet for at opbygge den igen:

Gå til Widgets
Vælg en eksisterende widget
Klik på Klon
Vælg målkanalen, og bekræft valget

Tilpas den klonede widget, udgiv den, og kopiér derefter koden til dit website.