← Zurück zu Integrationen Integrationen · WordPress

Das offizielle Plugin — ganz ohne Code.

Plugin installieren, Firmenschlüssel eintragen und per Shortcode dort platzieren, wo das Widget oder das komplette Buchungsformular erscheinen soll.

// 01

Installation

1
Laden Sie das Plugin — farebookings-book-now.zip — über Plugins → Add New → Upload Plugin (Plugins → Neu hinzufügen → Plugin hochladen) hoch oder kopieren Sie es per FTP nach wp-content/plugins/.
2
Aktivieren Sie das Plugin.
3
Öffnen Sie Settings → FareBookings (Einstellungen → FareBookings) und tragen Sie ein:
- Platform domain (Plattform-Domain) — app.farebookings.com oder, falls vorhanden, die White-Label-Subdomain des Kunden
- Company key (Firmenschlüssel) — aus dem Tab Frontend Ihres Admin-Bereichs
- Default language (Standardsprache)
- Default dark mode (Dunkelmodus als Standard) — optional
- Default short-form layout (Standard-Layout des Kurzformulars) — Vertical (das übliche Widget) oder Horizontal (eine breite Leiste) — optional, neu in v2.3
- Minimum short-form height (Mindesthöhe des Kurzformulars) — optional, neu in v2.5 — leer lassen, außer der Abschnitt zur Fehlerbehebung weiter unten trifft auf Sie zu

// 02

Shortcodes

Compact widget

[farebookings_widget]

lngSprache speziell für dieses Widget (sonst gilt der Standard aus Settings). z. B. [farebookings_widget lng="fr"]

darkDunkler (1) oder heller (0) Modus. z. B. [farebookings_widget dark="1"]

opts_openDas Options-Panel direkt aufgeklappt (1) oder wie gewohnt eingeklappt (0) starten.

layoutinline für die breite horizontale Leiste statt des vertikalen Widgets. Neu in v2.3. z. B. [farebookings_widget layout="inline"]. Der Shortcode hat immer Vorrang vor dem Standard aus Settings — um auf einer Seite vertikal zu erzwingen, obwohl websiteweit horizontal eingestellt ist, verwenden Sie [farebookings_widget layout=""].

heightMindesthöhe des Kurzformulars in Pixeln. Neu in v2.5 — siehe unten. z. B. [farebookings_widget height="700"]. Zulässig sind 700 oder 700px; alles andere wird ignoriert und die Höhe bleibt automatisch.

titleBeschreibender Text für das Iframe (Barrierefreiheit). z. B. [farebookings_widget title="Book your taxi"]

Formular beim ersten Laden abgeschnitten, nach einem Neuladen aber in Ordnung?

Das ist kein Fehler des Formulars selbst. Seine Höhe wird nach dem Laden der Seite von einem Skript gemessen — verzögert ein Caching-Plugin (LiteSpeed, WP Rocket und ähnliche) Skripte oder Styles, erfolgt die Messung zu früh und fällt zu klein aus. Beim Neuladen ist alles bereits im Cache, die Messung stimmt, und deshalb tritt das Problem scheinbar nur gelegentlich auf. Mit opts_open="1" zeigt es sich häufiger, weil das Formular dann von der ersten Darstellung an hoch ist.

Lösung: Legen Sie eine Mindesthöhe fest — entweder pro Seite mit height="700" im Shortcode oder websiteweit unter Settings → FareBookings → Minimum short-form height. Sind beide gesetzt, hat der Shortcode Vorrang vor der globalen Einstellung.

Es ist eine Mindesthöhe, keine feste Höhe — das Formular wächst weiterhin nach Bedarf (Options-Panel, Rückfahrt, zusätzliche Stopps). Der angegebene Wert wird lediglich nie unterschritten.
Leer bedeutet automatisch — das ist die normale, empfohlene Einstellung. Tragen Sie nur dann eine Mindesthöhe ein, wenn das oben beschriebene Problem tatsächlich auftritt.
Ein zu hoher Wert lässt freien Platz unter dem Formular. Orientieren Sie sich grob an der tatsächlichen Höhe des fertig geladenen Formulars.

Horizontales Layout — das sollten Sie wissen

Breite: benötigt etwa 1000px nutzbaren Platz. Begrenzt Ihr Theme die Inhaltsbreite (bei Blog-Themes üblich), platzieren Sie den Shortcode in einem Abschnitt mit voller Breite, sonst wird die Leiste gestaucht.
Mobil: ordnet sich unter 900px automatisch untereinander an — ein separater Shortcode für Mobilgeräte ist nicht nötig.

Full booking form

[farebookings_book_now]

Akzeptiert denselben Parameter lng, wenn Sie eine andere Sprache als den Standard aus Settings erzwingen möchten.

Die Größenanpassung erfolgt automatisch

Beide Shortcodes übernehmen die Größenanpassung des Iframes und die Weitergabe der Daten, wie sie in den Anleitungen für PHP und reines HTML beschrieben sind, intern — hier ist nichts zu ergänzen. Relevant wird das erst, wenn Sie das Plugin weglassen und den Code stattdessen von Hand einfügen (siehe unten).

// 03

Kampagnen-Tracking — automatisch

Das Plugin erfasst gclid (Google Ads), gbraid/wbraid, die Standard-Parameter utm_* und fbclid (Meta) auf jeder Seite der Website und gibt sie automatisch an beide Shortcodes weiter — Sie müssen nichts konfigurieren.

Warum das wichtig ist

Widget und Formular laufen auf einer anderen Domain als die Website des Kunden. Werden diese Parameter nicht durchgereicht, können Google Ads und Meta eine Buchung nicht mehr der Kampagne zuordnen, die sie tatsächlich ausgelöst hat.

// 04 · Nur, wenn Sie das Plugin nicht verwenden

Code stattdessen manuell einfügen?

Nicht empfohlen — das Plugin oben erledigt alles Folgende bereits für Sie —, aber wenn ein Kunde den rohen Widget-/Formular-Code in WordPress einfügt, statt die Shortcodes zu nutzen, folgen Sie für den eigentlichen Einbettungscode der Anleitung für PHP oder reines HTML und achten Sie zusätzlich auf zwei WordPress-spezifische Stolperfallen.

WordPress entfernt beim Speichern das <script>-Tag

Fügen Sie den Code in einen normalen Absatzblock oder in den Visuell-Modus des Classic Editors ein, entfernt WordPress aus Sicherheitsgründen stillschweigend alle <script>-Tags — übrig bleibt nur das <div>/<iframe>, ohne das JavaScript, das es zum Funktionieren braucht.

Lösung: Verwenden Sie in Gutenberg einen Custom HTML-Block, im Classic Editor den Tab Text, oder lassen Sie das Snippet automatisch in Header/Footer einfügen, statt es überhaupt in den Inhalts-Editor zu kopieren.

Caching-Plugins können das Skript verzögern

Plugins wie WP Rocket bieten die Option „Delay JavaScript execution“ (JavaScript-Ausführung verzögern), um das Laden der Seite zu beschleunigen — sie kann die Reihenfolge durcheinanderbringen, auf die iframeResizer angewiesen ist.

Lösung: Nehmen Sie die Skripte von FareBookings in den Einstellungen des Caching-Plugins von dieser Verzögerung aus — als Ausschlussmuster funktionieren der Dateiname iframeResizer, die Domain app.farebookings.com oder die id des Iframes.

// 05

Plugin aktualisieren

1
Plugins → FareBookings deaktivieren → löschen.
2
Neue ZIP-Datei hochladen → aktivieren.
3
Ihre Einstellungen bleiben erhalten — Firmenschlüssel, Server, Sprache, Dunkelmodus und Mindesthöhe liegen in der Option fb_settings, die das Löschen des Plugins in der Plugin-Übersicht nicht berührt.
4
Öffnen Sie Settings → FareBookings und wählen Sie ein Layout, falls die horizontale Leiste gewünscht ist.

So prüfen Sie, welche Version tatsächlich installiert ist

Durchsuchen Sie den Seitenquelltext (Strg+U) nach FB_PLUGIN_v2.5 — er erscheint sowohl auf der Widget-Seite als auch auf der Seite mit dem Buchungsformular.

Prüfen Sie nach dem Update:

Jede Seite, die bereits das Widget enthielt, sieht weiterhin genauso aus wie zuvor.
Eine Seite mit layout="inline" zeigt die Leiste in voller Breite, ohne Lücke darunter.
Mit der Leiste: Options öffnen → Stops aktivieren — das Iframe wächst mit, es erscheint keine interne Scrollleiste, und die Autovervollständigung wird nicht abgeschnitten.
Ein Link mit ?gclid=test123 auf die Widget-Seite reicht die gclid weiterhin bis ins Buchungsformular durch — das Tracking selbst hat sich nicht geändert, aber es ist die Standardprüfung.

// Gängige Optionen

DunkelmodusShortcode-Attribut dark="1".

Options-Panel offenShortcode-Attribut opts_open="1".

SpracheShortcode-Attribut lng="es", lng="fr" usw.

Horizontale LeisteShortcode-Attribut layout="inline". Nur für das Widget, ab v2.3.

MindesthöheShortcode-Attribut height="700". Ab v2.5. Behebt ein abgeschnittenes Formular beim ersten Laden.

// So prüfen Sie, ob es funktioniert

Tracking überprüfen

Rufen Sie eine beliebige Seite auf, an deren URL ?gclid=test123 angehängt ist.
Senden Sie das Widget oder Formular ab und prüfen Sie, ob die Buchung diesen Wert übernimmt.

Sie arbeiten mit einer anderen Plattform?

Für reine PHP-Websites und für Websites ganz ohne Backend gibt es eigene Anleitungen.

← Zurück zu Integrationen Fragen Sie uns per WhatsApp