Bitte beachte, dass die Möglichkeit zur Integration von Deinem Kalender in einem iFrame nicht länger von Facebook unterstützt wird. Du kannst aber immer noch einen „Jetzt Buchen“ Button, der zu Deinem Kalender weiterleitet auf Deiner Facebook Seite einfügen. Wie Du den Button einfügen kannst, erfährst Du in unserer Anleitung Einen Button zu Deiner Facebook Seite hinzufügen.

Integriere Deinen Kalender in einem iFrame auf Deiner Facebook Seite

Diese Anleitung erklärt, wie ein SuperSaaS Kalender in einem Fenster in Deine Facebook Seite integriert wird. Der iFrame erlaubt den Benutzern auf Deinen Kalender zuzugreifen, ohne Facebook zu verlassen. Wenn Du lieber den Kalender mit einem Button einfügst, dann nutze lieber die Anleitung Setze einen Jetzt Buchen Button auf Deine Facebook Seite.

Was brauchst Du für die Integration?

Eine Facebook Business Seite
Ein SuperSaaS Konto mit einem Paket Abo mit SSL Verschlüsselung und mindestens einem Kalender.

Deinen SuperSaaS Kalender in einem Fenster auf Deiner Facebook Seite einfügen

Logge Dich auf Deiner Business-Facebook-Seite ein
Öffne ein weiteres Fenster in Deinem Browser und gehe zu: apps.facebook.com/static_html_plus/
Wähle Add Static HTML to a Page
Wenn Du mehrere Business-Seiten auf Facebook hast, dann wähle zuerst die Seite aus, in die Du den Kalender integrieren willst, klicke erst dann Add Static HTML: iframe tabs.
Der HTML-Tab (Reiter) wird nun auf Deiner Facebook Business Seite erscheinen.
Um den HTML-Tab zu bearbeiten, klicke auf ‚Einstellungen‘ und wähle Apps aus der linken Reihe aus.
Wähle den ‚iframe Tabs‘, den aus, den Du bearbeiten möchtest, und klicke auf Einstellungen bearbeiten.

Jetzt kann der vorgegebene Text Willkommen in einen eigenen Text verändert werden, wie beispielsweise Hier Buchen. Klicke Speichern und dann klicke OK.

Wiederhole Schritt 7, um das vorgegebene Bild zu ändern. Dieses Mal klicke auf „Ändern“ neben Eigenes Symbol:. Dort erscheint eine neue Seite unter ‚Individuelles Bild hochladen‘. Bewege die Maus über das Bild mit dem Stern und klicke auf „Bearbeiten“.

Ein Pop-up-Fenster öffnet sich, mit dem ein Bild von Deinem Computer hochgeladen werden kann. Dieses Bild muss 111 in der Breite × 74 Pixels in der Höhe haben und als JPG-, GIF- oder PNG-Datei vorliegen.

Du kannst eines der Beispiele von unten benutzen (klicke rechts und wähle ‚Sichern unter …‘) oder erstelle einen eigenen Schaltknopf.

Eine Vorschau von dem Bild erscheint, ohne die Möglichkeit diese zu sichern. Trotzdem erscheint das Bild auf Deiner Facebook Seite. Wenn Du dahin zurückgehst, findest Du es auf der linken Seite unter dem Titel ‚Apps‘

Vorschau und navigiere zurück zu Deiner Seite

Jetzt, da das Styling abgeschlossen ist, können wir den iFrame in die Seite integrieren. Klicke dafür auf Deinen neu erstellten Nun Buchen! Schaltknopf (den Static HTML Tab) und klicke auf Bearbeiten. Oder Du findest Dein erstelltes Bild als Schaltknopf unter ‚Apps‘ auf der linken Seite Deiner Facebook Seite und klickst auf Set up tab.
Wähle unter Einstellungen auf Deiner Facebook Seite ‚Einstellungen‘, gehe zu Apps und wähle die entsprechende App aus und klicke auf Link zu dieser Webseite erstellen. Dann erscheint ein Pop-up-Fenster mit der bisherigen URL, auf die Du nochmal klickst. Es erscheint ein neues Bild, klicke dort auf Edit Tag. (Es ist auch möglich mit der HTML app stattdessen zu arbeiten. Dort klickst Du auf Embed your website für eine schnelle Integration.).
Kopiere die URL Deines SuperSaaS Kalenders und kopiere sie unter Website – Web address in das Feld; das mit ‚https://‘ beginnt. Klicke dann auf den rechts neben der URL stehenden Schaltknopf Apply change. Danach stelle sicher, dass das Häkchen unter ‚Remove scrollbars‘ gesetzt ist, damit Deine Seite in die Facebook Seite passt und klicke dann auf Save & Publish. Klicke auf den Schaltknopf Preview, um eine Vorschau für Deine Facebook Webseite zu sehen. Um Korrekturen vorzunehmen, wiederhole den Vorgang, solange bis die richtige Seite erscheint. Dann ist Deine Seite als iFrame in Facebook eingebettet.

Damit der iFrame auf einer Facebook Seite richtig dargestellt wird, musst Du „SSL“ in Deinem SuperSaaS Konto freischalten. Du kannst auf SSL innerhalb Deines SuperSaaS Kontos umschalten unter Zugangs Kontrolle auf dem Dashboard. (Das bedeutet, dass der Link zu Deinem Kalender mit dem Kode https beginnt, anstatt mit http wie zuvor.)

Wenn Du den Kalender nicht in einen iFrame (wo es mit 800 Pixeln die Breite der Facebook Seite einnimmt) setzen möchtest, kannst Du stattdessen einen Schaltknopf oder Link zu Deiner Kalender- und Terminseite nutzen. Dann erscheint der Kalender in seinem eigenen Fenster im Browser. (In diesem Fall wäre SSL nicht nötig.)

Nutze ein ‚leadgate‘, um Besucher der Seite anzuregen, Deine Facebook Seite mit ‚Gefällt mir‘ zu kennzeichnen

Wenn Du Deinen Buchungs- oder Terminkalender in Deine Facebook integriert hast, bietet Dir die App ‚Static HTML: iframe tabs‘ die Möglichkeit an ein leadgate zu erstellen. Falls Du das ‚leadgate‘ wählst (enable), dann wird den Leuten ein Pop-up-Fenster angezeigt, indem Informationen von ihnen gesammelt werden, bevor sie Deinen eingefügten Terminkalender sehen können.

Wenn Du die App ‚Static HTML: iframe tabs‘ im Administratoren Bereich Deiner Facebook Seite siehst, klicke auf bearbeiten. Klicke dann auf Leadgate.
Wähle Enable leadgate, stelle eine Mitteilung für Deine Besucher ein und klicke Save & publish.