Preskočiť na obsah

Ako vytvoriť widget

Prehľad

Widget TicketingHub Booking je nástroj v jazyku JavaScript, ktorý sa integruje do webových stránok a umožňuje zákazníkom rezervovať si produkty priamo. Vytvoríte ho v ovládacom paneli, nakonfigurujete jednotlivé časti a na svoju stránku vložíte krátky úryvok kódu.

Podporované prehliadače

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

Vytvorenie nového widgetu

  1. V ovládacom paneli prejdite na Widgety
  2. Kliknite na Nový widget
  3. Zadajte názov widgetu, vyberte produkty, ktoré má predávať, a kliknite na Vytvoriť widget

Dostanete sa na stránku nastavení widgetu, kde nakonfigurujete všetko ostatné. Na ľavej strane sa nachádzajú nastavenia zoskupené do sekcií; na pravej strane sa zobrazuje živý náhľad widgetu, ktorý sa pri vykonávaní zmien aktualizuje.

Konfigurácia widgetu

Čo predávate

Vyberte produkty, balíky a darčekové poukazy, ktoré widget ponúka, pridajte doplnky (všetky alebo ručne vybraný zoznam) a rozhodnite, či si zákazníci môžu produkty kúpiť ako darčekové poukazy alebo darčekové poukazy vo widgete uplatniť.

Proces rezervácie

Vyberte, ako sa zákazníci pohybujú vo widgete: Najskôr vstupenky (vyberú si vstupenky a potom dátum a čas), Najskôr podujatie (prezerajú si kalendár a potom vyberú, čo si chcú rezervovať) alebo Iba uplatnenie poukazu. Môžete tiež nastaviť predvolené zobrazenie kalendára a požiadať zákazníkov, aby svoj e-mail zadali dvakrát, čím sa predíde preklepom.

Pravidlá predaja

Určite, kedy a čo widget predáva: dátum a čas začatia predaja, dátum, na ktorý sa otvorí kalendár, kedy sa má zobrazovať zostávajúca kapacita časového intervalu a v ktorých menách môžu zákazníci platiť. Ak v prvom týždni alebo mesiaci zobrazenom v kalendári nie je možné nič rezervovať, kalendár sa posunie dopredu a otvorí sa na prvom dátume, pri ktorom je rezervácia možná.

Vzhľad

Pridajte vlastný CSS kód a dolaďte vzhľad widgetu tak, aby zodpovedal vašej značke.

Analytika

Prepojte Google Analytics alebo Google Tag Manager a sledujte, ako návštevníci používajú váš widget.

Rozšírené

Po nákupe presmerujte zákazníkov na stránku podľa vlastného výberu a nastavte parameter URL, ktorý používajú vaši predajcovia, aby sa ich rezervácie priradili k nim.

Náhľad, publikovanie a nasadenie

Zmeny, ktoré vykonáte, sa ukladajú ako koncept v živom náhľade — kliknutím na Aktualizovať náhľad ich zobrazíte napravo bez vplyvu na aktívny widget. Keď budete spokojní, kliknutím na Publikovať ich aktivujete alebo kliknutím na Zrušiť koncept zahodíte.

Ak chcete widget umiestniť na svoju webovú stránku, otvorte Pokyny na inštaláciu: skopírujte značku scriptu na svoju stránku, potom si vyberte medzi widgetom Vložený (zobrazí sa priamo v obsahu stránky) a widgetom Modálne okno/Vyskakovacie okno (otvorí sa v prekrytí po kliknutí na tlačidlo) a vložte príslušný úryvok kódu.

Ako widget posúva stránku

Keď zákazník prejde na ďalší krok, widget posunie stránku späť na začiatok rezervačného formulára, aby zákazník, ktorý sa posunul nadol v dlhom zozname vstupeniek, neskončil uprostred nasledujúceho kroku. Ak ste widget umiestnili do vlastného posúvateľného panela, posúva sa tento panel a stránka sa posunie tiež až vtedy, keď sa samotný panel posunie mimo viditeľnej oblasti. Widget to urobí vtedy, keď sa horná časť formulára posunie mimo viditeľnej oblasti, a tiež vtedy, keď formulár presahuje spodnú časť obrazovky, pričom nad ním zostáva dostatok voľného priestoru. Ak sa formulár už celý zmestí na obrazovku, zostane na svojom mieste. Widget zároveň ponecháva priestor pre hlavičku pripevnenú k hornej časti stránky.

Ak to nevyhovuje vášmu rozloženiu, zabráňte posúvaniu stránky pridaním \"scrollOnStepChange\": false do kódu widgetu, ktorý ste vložili:

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

Ak sa vaša hlavička pri posúvaní návštevníkov nadol skryje a pri posúvaní nahor znova zobrazí, widget nedokáže zmerať jej výšku a horná časť formulára môže skončiť za ňou. Namiesto vypnutia posúvania zadajte widgetu výšku hlavičky v pixeloch:

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

Klonovanie existujúceho widgetu (klasické widgety)

Ak používate klasický editor widgetov, môžete widget duplikovať namiesto jeho opätovného vytvárania:

  1. Prejdite na Widgety
  2. Vyberte existujúci widget
  3. Kliknite na Klonovať
  4. Vyberte cieľový kanál a potvrďte výber

Klonovaný widget prispôsobte, potom ho publikujte a skopírujte kód na svoju stránku.