Bundle einbetten

Das go~mus-Buchungs-Bundle mit einem Script-Tag in eine bestehende Webseite holen, als Overlay oder direkt auf der Seite. Was du brauchst, wie es aussieht, und was in deiner mitgelieferten Doku steht.

Diese Seite ist für alle, die eine Museums-Webseite pflegen und die go~mus-Buchung direkt darauf anbieten wollen, ohne eigenen Shop und ohne tiefe Entwicklung. Wer ein CMS wie Typo3 oder WordPress oder ein eigenes System betreut, kommt damit zurecht.

Wichtig vorweg. Jedes Bundle wird für dein Haus gebaut und kommt mit einer eigenen, auf deine Instanz zugeschnittenen Dokumentation. Dort stehen deine konkrete Bundle-Adresse, deine Ticket-Gruppen und deine Veranstaltungs-Kategorien. Diese Seite erklärt die Grundmechanik, die für jedes Bundle gleich ist. Zum Anschauen gibt es eine Live-Demo.

Was das Bundle ist

Das Bundle ist die komplette go~mus-Buchung als eingebettetes Fenster. Datum, Tickets, Warenkorb, Gutschein-Einlösung und Gast-Checkout laufen in deiner Seite ab, gestaltet in deiner Marke. Technisch ist es ein einzelnes Script, das die Buchung in einem gekapselten Bereich (Shadow DOM) rendert, ohne deine Styles zu stören. Kein iframe, kein zweites CMS.

Zwei Zeilen genügen. Das Script einmal pro Seite laden, am besten vor </body>, und einen Auslöser setzen:

<script src="https://<dein-bundle>.gomus.de/embed.js" defer></script>

<a href="https://<dein-shop>" data-gomus-embed>Tickets buchen</a>

Der Klick öffnet die Buchung als Overlay. Das href ist der Fallback ohne JavaScript und führt in den vollwertigen Shop. Die genaue Bundle-Adresse steht in deiner mitgelieferten Doku.

Overlay oder direkt auf der Seite

Zwei Darstellungen, dieselbe Buchung:

DarstellungAuslöserWann passt das
Overlay (Standard)Button oder Link mit data-gomus-embedDie Buchung soll über der Seite aufgehen, schmal als Drawer oder breit als Dialog
InlineContainer <div data-gomus-embed-inline></div>Die Buchung soll fest in einer Seite stehen, etwa auf einer eigenen Tickets-Seite

Beides lässt sich gemeinsam auf einer Seite nutzen.

Welche Buchung geöffnet wird

Standardmäßig öffnet das Bundle den Ticket-Verkauf. Über Attribute steuerst du gezielt einen Einstieg an:

  • data-gomus-flow="tickets" für Tickets (Standard), optional eine bestimmte Gruppe über data-gomus-ticket-group
  • data-gomus-flow="events" für öffentliche Führungen und Veranstaltungen, optional eine Kategorie über data-gomus-event-category

Welche Gruppen- und Kategorie-Nummern dein Haus hat, steht in deiner Doku. Mehrere Auslöser auf einer Seite sind erlaubt, etwa je ein Button für Tageskarten, Zeitfenster und Führungen.

Sprache

Das Buchungsfenster folgt der Sprache deiner Seite. Die Reihenfolge:

1. data-gomus-locale direkt am Auslöser oder Container

2. der Parameter ?gomus-locale= in der URL

3. das lang-Attribut deines <html>-Tags

4. sonst die Standardsprache (de)

Verfügbar sind die Sprachen, die dein Haus pflegt, in der Regel de und en. Andere fallen auf die Standardsprache zurück.

In deiner Marke

Farben und Eckenradius kommen über CSS-Variablen, die über die Shadow-Grenze hinweg wirken:

--gomus-accent: #0a7d61;
--gomus-accent-strong: #04342c;
--gomus-bg: #ffffff;
--gomus-text: #1c1917;
--gomus-header-bg: #04342c;
--gomus-radius: 6px;

Für feinere Anpassungen sind benannte Bereiche über ::part() ansprechbar: backdrop, panel, header, close, content, footer, cta. Noch mehr Kontrolle über das Aussehen geben die Web Components, wenn du einzelne Bausteine selbst zusammensetzt.

Was du noch beachtest

  • Content-Security-Policy. Wenn deine Seite eine CSP setzt, muss die Bundle-Adresse für Script, Styles, Schriften und API-Aufrufe freigegeben sein. Die nötigen Einträge stehen in deiner Doku.
  • Gast-Checkout. Das Bundle verkauft bewusst schlank, ohne Kundenkonten. Wer Konten, Bestellhistorie und eigene SEO-Seiten für Tickets braucht, nutzt den eigenen Shop.
  • Updates. Die Bundle-Adresse bleibt stabil. Updates liefern wir automatisch an dieselbe URL aus, du musst nichts nachziehen.

Nachfolger der Buchungs-Widgets

Das Bundle ist die modernere, flexiblere Weiterentwicklung der iframe-Widgets. Für das Buchen von Einzelplätzen und Gruppen planen wir, das bisherige Buchungs-Widget in kommenden Releases durch das Bundle abzulösen: kein iframe mehr, sondern ein Script-Tag, mit Theming über CSS-Variablen sowie Overlay und Inline aus einer Hand. Für neue Integrationen ist das Bundle daher schon jetzt die empfohlene Wahl.

Verwandte Seiten

  • go~mus + shop für die drei Wege zum Ticketverkauf im Überblick
  • Live-Demo für das Bundle als Overlay und inline zum Ausprobieren
  • Widgets für die iframe-Variante, die das Bundle perspektivisch ablöst
  • Web Components für einzelne Bausteine in der tiefen Integration
  • Webseiten-Integration für Kalender, Anfragen und Direktbuchung rund um die Buchung