Das neue React Booking-Widget: So funktioniert es!

React Bookin- Widget von Regiondo

Es gibt Neuigkeiten bei Regiondo! Wir stellen Ihnen unser neues React Booking-Widget vor, mit dem Sie Ihren Ticketshop noch individueller gestalten können. Mit der neuesten Technologie, schnelleren Ladezeiten, einem neuen cleaneren Design und flexiblen Gestaltungsmöglichkeiten können Sie Ihre Angebote nun noch besser promoten. Wenn Sie Ihren Kunden also eine detaillierte Beschreibung Ihrer Angebote präsentieren möchten, ist das neue React Booking-Widget genau das richtige für Ihre Zwecke.

In diesem Artikel erfahren Sie alles Wissenswerte zum React Booking-Widget. Los geht’s!

Integration des neuen React Booking-Widgets

Um das neue Booking Widget in Ihrem Ticketshop zu integrieren sind nur wenige Klicks notwendig. Mit dem Widget können Sie Ihre Angebote detailliert beschreiben und in Ihrem Shop präsentieren. Die Präsentation bleibt dabei ganz Ihnen überlassen. Sie können hier frei wählen wie das Widget dargestellt werden soll und zahlreiche Anpassungen machen. Ihr individuelles Design und der Stil Ihrer Marke wird mit den personalisierten Einstellungen auch im Booking-Widget bestens dargestellt. 

Auf Ihrer Webseite finden Sie unter dem Karteireiteiter ‚Shop konfigurieren‘ > ‚Integration Webseite‘ > ‚React Booking Widget‘ den Button ‚React.JS‘. Diesen klicken sie ganz einfach und das Buchungs-Widget wird für Sie konfiguriert. Falls Sie hier Schwierigkeiten haben stehen wir Ihnen unter support@regiondo.com zur Verfügung.

Eine Schritt-für-Schritt-Anleitung finden Sie hier.

 Vorteile des React Booking-Widgets

Durch den Einsatz der neuesten Technologien werden schnellere Ladezeiten möglich. Auch in Hinsicht auf Suchmaschinen-Optimierung gibt es Neuigkeiten. Dadurch, dass die Inhalte auf Ihrer eigenen Webseite geladen werden, kann Google Ihre Daten besser auslesen und Ihr Ranking kann dadurch verbessert werden. Das neue klare Design ist nicht nur übersichtlicher, sondern unterstützt auch nutzerfreundliche Handhabung und bei den zahlreichen Möglichkeiten der Individualisierung können Sie Ihrer Fantasie freien Lauf lassen. Text, Stil, Farbe, Größe und Warenkorbeinstellungen können individuell gestaltet werden. Setzen Sie hier ein starkes Zeichen und gestalten Sie Ihr Booking-Widget Brand-konform. Außerdem können Sie nun auch einzelne Widgets anpassen, anstatt alle gleichzeitig zu verändern und so noch individuellere Widgets gestalten. Perfekt für die Winter- oder Sommersaison. 

Individuelle Anpassung des Booking-Widgets

  • Platzierung auf der Webseite: Nachdem Sie das gewünschte Produkt ausgewählt und Ihren persönlichen HTML-Code generiert haben, kann das Fein-Tuning losgehen. Sie können zuallererst entscheiden, wo auf Ihrer Seite Sie das Buchungs-Widget platzieren wollen. Da es beim Laden der Seite als DIV-Tag dargestellt wird, können Sie es entweder innerhalb des HEAD-Tags zusammen mit dem DIV-Tag oder vor dem Schließen des BODY-Tags einbetten. Der Vollständigkeit halber finden Sie hier eine Buchungsübersicht.
  • Attribute und deren Default-Einstellung: Die Standardeinstellungen des Widgets umfassen bereits grundlegende Attribute wie beispielsweise: Sprachraum, Anbietercode, Produkttitel, Schriftart, Breite und viele mehr. Diese sind meist sinnvoll, können aber zum Teil auch weggelassen oder verändert werden. 
  • Individuell anpassbare Attribute: Es gibt zahlreiche Widget-Attribute, die Sie individualisieren können. Beispielsweise sind Anpassungen der Attribute möglich, oder auch komplette Weglassung einzelner Bestandteile, die für Ihre Webseite nicht relevant sind. Sie können zum Beispiel das gewünschte Produkt als Geschenkoption darstellen lassen, ein vorgewähltes Datum für eine Aktivität definieren oder auch das Standardverhalten Ihres Widgets bestimmen, um nur ein paar Widget-Attribute zu nennen. Natürlich können Sie hier auch schon Veränderungen der Schriftgröße und -art vornehmen, es werden viele der Google Fonts unterstützt. Auch Anpassungen des Warenkorbs und der Größe des Widgets und dessen Schaltflächen sind kinderleicht. 
  • CSS: Das neue Booking-Widget kann leicht mit CSS angepasst werden, da alle Widget-Inhalte ohne iFrames dargestellt werden. Dazu müssen bloß CSS-Regeln mit einer .css Datei und <link>-Tags auf der Webseite hinzugefügt werden. Falls dies nicht so ganz Ihrem Geschmack entspricht, können Sie das Widget auch mit Javascript bearbeiten. Eine detaillierte Beschreibung des Vorgehens finden Sie hier.

Anpassen von Texten und Übersetzungen mit dem React Booking-Widget

Dank spezieller CSS-Regeln können nicht nur die Farben oder Stile von HTML-Elementen angepasst werden, sondern auch Textinhalt verschiedener Elemente innerhalb des Booking-Widgets. Sie können nun den Text von Produkt- und Geschenk-Schaltflächen an Ihr spezifisches Sprachgebiet anpassen und so nationale und internationale Kunden ansprechen.

Auch der Text des Kalenders kann geändert werden. Manche Elemente haben spezifische Klassen, die auf dem Status des Elements oder der Benutzeraktion beruhen. Diese können verwendet werden, um den Text zu ändern, selbst nachdem der Benutzer bereits eine Option gewählt hat. So können Sie Datum, Uhrzeit oder auch den Reiter Optionen jederzeit nach Belieben umgestalten und umbenennen. Den Text Ihrer Zeitfenster können und sollen Sie an Ihre buchbaren Zeitfenster anpassen, hier gibt es Standardeinstellungen von Nacht, Morgen, Nachmittag und Abend – von wann bis wann diese Zeiträume genau sind, können Sie individuell bestimmen. Sie haben auch die Option Zeiträume auf Ihrer Seite auszublenden.

Ihr Warenkorb ist einer der wichtigsten Bestandteile Ihrer Seite, deshalb haben Sie mit dem neuen React-Booking-Widget die Möglichkeit den Button-Text des Warenkorbes zu personalisieren und auch Buttons wie ‚Einkauf fortsetzen‘ oder ‚Code einlösen‘ nach Ihren Kriterien zu gestalten. Der Fortschritt des Checkouts wird im Warenkorb angezeigt, auch hier können Sie selbst bestimmen wie die einzelnen Schritte heißen.

Falls Sie Probleme haben gewisse CSS-Regeln anzusprechen, haben Sie auch die Möglichkeit den Text mithilfe von Javascript zu überschreiben.

Änderung der Farb- und Stileinstellungen des Ticketshops

 

Sie können die meisten Farben der Widgets mit dem Shop Editor im Regiondo-Dashboard unter dem Abschnitt „Design“ im Register „Produktdetails“ ändern. Zusätzlich haben Sie die Möglichkeit die Widget-Farben global oder individuell zu überschreiben, wobei es wichtig ist, dass der Farbwert eine gültige CSS-Farbe darstellt. Sie können also ein Produkt oder eine ganze Produktgruppe wählen und für diese aus der vordefinierten Farbliste eine benutzerdefinierte Farbe einstellen. 

Sie können mit dem neuen Booking-Widget auch die Farben von Buttons im aktiven sowie im inaktiven Status ändern. Auch Kalenderfarben und -stile können angepasst und nach CSS-Regeln gestaltet werden.

Auch die Stile der Zeitfenster können Sie mit wenigen Klicks an Ihren individuellen Stil anpassen. Hier sind sowohl vorgefertigte Optionen für Sie verfügbar als auch eine komplett eigenständiges Design möglich. Natürlich können Sie in diesem Schritt auch Symbole, Farben und Stile für Datum und Uhrzeit definieren und andere Buttons wie ‚entfernen‘ farblich nach Ihren Wünschen gestalten.

Text ist die eine Sache, Schriftgröße die Andere. In diesem Abschnitt steht es Ihnen auch frei die Schriftgröße der verschiedenen Textabschnitte des Widgets und Ihrer Produktseite zu verändern und anzupassen. Passen Sie hierbei darauf auf, die Größen möglichst leserlich zu wählen und die Seite nicht zu überfüllen.

Ein absolutes Highlight des neuen React Booking-Widgets ist die Möglichkeit globale Stile zu übernehmen. Da alle Widget-Tags direkt auf der Seite ohne Verwendung von iFrames generiert werden, können alle globalen CSS-Regeln mit den vom Widget festgelegten CSS-Regeln interferieren.

Fazit

Das neue React Booking-Widget bietet Ihnen zahlreiche Möglichkeiten Ihre Produktseite zu gestalten und schränkt Sie hier in keinster Weise ein. Das Widget, als neue Alternative zum Einbinden der Regiondo Buchungsstrecke auf Ihrer Webseite bringt Schwung in Ihre Seite und hilft Ihnen Beschreibungen Ihrer Angebote für Kunden bereitzustellen und diese neu zu gestalten.

Da das Booking-Widget lediglich den Buchungsvorgang über Ihren Ticketshop abwickelt, bleibt Ihnen bei der Präsentation Ihrer Angebote genügend Freiraum, um Ihre Webseite gänzlich nach Ihren Vorstellungen zu gestalten.

Mit der neuesten Technologie bringt Ihnen das Widget einen Vorteil von schnelleren Ladezeiten und einem besseren Ranking bei Google. Auch das neue cleane Design schafft eine klare Übersicht und generiert eine nutzerfreundliche Oberfläche auf Ihrer Webseite.

Mit den flexiblen Gestaltungsmöglichkeiten bleiben Sie der Boss Ihrer Seite und gestalten ganz einfach innerhalb des Widgets. Buttons, Textfelder, Schriftgrößen und -stile gibt es in Hülle und Fülle, lassen Sie Ihrer Kreativität freien Lauf.

Neues_Booking-Widget_Free_Trial