So binden Sie Google Kalender in WordPress ein (kostenlose Methoden + Plugin-Methoden)
Kurz gesagt: Um Google Kalender in WordPress einzubetten , öffnen Sie Google Kalender auf einem Computer, wählen Sie den Kalender unter Einstellungen aus , suchen Sie nach Kalender integrieren und kopieren Sie den iFrame-Code.
In WordPress fügen Sie einen hinzu Benutzerdefinierte HTML Blockieren Sie den Block, fügen Sie den Code ein und veröffentlichen Sie die Seite. Wenn Sie gebrandete Veranstaltungsseiten, Filter, Buchungsfunktionen oder Ticketverkauf benötigen, importieren Sie die Veranstaltungen mit Modern Events Calendar statt Googles iFrame anzuzeigen.
Der Kalender muss öffentlich zugänglich sein oder mit denjenigen Personen geteilt werden, die ihn benötigen. Für einen öffentlichen Kalender reicht die kostenlose Methode aus. Überprüfen Sie die veröffentlichte Seite auf einem Smartphone, da die Monatsübersicht selbst dann noch beengt wirken kann, wenn der iFrame die Seitenbreite ausfüllt.
Die meisten Leute, die nach einer Möglichkeit suchen, Google Kalender in WordPress einzubetten, möchten den Kalender heute sehen und nicht einen langen Plugin-Vergleich.
Die iFrame-Methode dauert nur wenige Minuten und benötigt kein Plugin. Ihre Grenzen werden erst dann relevant, wenn der Kalender für Endkunden bestimmt ist oder über einen einfachen Zeitplan hinausgehende Funktionen benötigt.
Welche Methode sollten Sie verwenden?
Nutzen Sie den kostenlosen iFrame für einen einfachen öffentlichen Terminplan. Verwenden Sie ein spezielles Veranstaltungskalender-Plugin wie MEC, wenn Veranstaltungen eigene WordPress-Seiten, mehr Gestaltungsmöglichkeiten, Buchungs- und Ticketfunktionen oder geplante Importe benötigen.
| Methodik | Am besten geeignet, | Kosten | Hauptabwägung |
|---|---|---|---|
| Google Kalender iFrame | Öffnungszeiten, Kurspläne, Termine für die Öffentlichkeit, interne Kalender | Frei | Begrenzte Gestaltungsmöglichkeiten und keine nativen WordPress-Veranstaltungsseiten |
| Google Kalender-Block auf WordPress.com | WordPress.com-Websites, die den Block bereits haben | IM PREIS ENTHALTEN | Das Ergebnis ist weiterhin eine von Google gehostete Einbettung. |
| MEC-Import und -Anzeige | Öffentliche Veranstaltungen, Verzeichnisse, Buchungen, Tickets und Marken-Veranstaltungsseiten | Kostenlos oder kostenpflichtig, je nach den genutzten Funktionen und Zusatzoptionen. | Mehr Aufwand als das Kopieren eines iFrames. |
Falls Sie mehr als einen Kalender benötigen, folgen Sie unserer Anleitung zum Erstellen einer kompletten Veranstaltungswebsite in WordPress , einschließlich Veranstaltungsseiten, Registrierung, Tests und Veröffentlichung.
Wie kann man Google Kalender kostenlos in WordPress einbinden?
Kopieren Sie den iFrame aus den Kalenderintegrationseinstellungen von Google Kalender und fügen Sie ihn in einen benutzerdefinierten HTML-Block in WordPress ein. Laut Google ist der Einbettungscode nur über einen Computer, nicht aber über die mobile Kalender-App verfügbar.
Schritt 1: Wählen Sie aus, was Besucher sehen dürfen.
- Melden Sie sich am Computer an unter calendar.google.com.
- Der Meine KalenderKlicken Sie auf den Kalender, den Sie veröffentlichen möchten.
- Klicken Sie auf das Drei-Punkte-Menü, dann Einstellungen und Freigabe.
- Überprüfen Sie die Zugriffsberechtigungen des Kalenders.
Eine öffentliche Website kann nicht jedem Besucher einen privaten Kalender anzeigen. Wenn der Kalender für alle sichtbar sein soll, aktivieren Sie die Option „ Öffentlich zugänglich machen“.
Google warnt davor, dass öffentliche Kalender Veranstaltungsdetails preisgeben können. Daher ist ein separater Kalender für Website-Veranstaltungen die sicherere Wahl. Fügen Sie die geheime iCal-Adresse des Kalenders niemals auf einer öffentlichen Seite ein.
Schritt 2: Kopieren Sie den Google Kalender-Einbettungscode
- Bleiben Sie auf der Einstellungsseite des Kalenders und scrollen Sie zu Kalender integrieren.
- Der Embed Code, klicken Anpassen Wenn Sie die Standardansicht, die angezeigten Elemente, die Farbe, die Sprache, die Zeitzone, die Breite oder die Höhe ändern möchten.
- Kopieren Sie den vollständigen iFrame-Code.
Googles aktuelle Anleitung empfiehlt, beide Dimensionen im Customizer auf mindestens 500 Pixel einzustellen. Sie können den iFrame aber auch per CSS so anpassen, dass er eine schmalere Inhaltsspalte ausfüllt, wie unten gezeigt.
Schritt 3: Fügen Sie den iFrame in WordPress ein.
- Öffne die WordPress-Seite oder den Beitrag, in dem der Kalender erscheinen soll.
- Klicken Sie auf den Blockeinfüger und fügen Sie einen Block hinzu. Benutzerdefinierte HTML blockieren.
- Fügen Sie den iFrame-Code in diesen Block ein.
- Arbeiten jederzeit weiterbearbeiten können. Jede Präsentation und jeder KI-Avatar, den Sie von Grund auf neu erstellen oder hochladen, Vorschau Um die Live-Seite zu überprüfen, veröffentlichen oder aktualisieren Sie sie anschließend.
Wenn Besucher den iFrame-Code als Text sehen, wurde er in einen Absatz- oder Codeblock eingefügt. Verschieben Sie ihn in einen benutzerdefinierten HTML-Block.
Schritt 4: Passe den Kalender an die Seitenbreite an
Die einfachste Anpassung besteht darin, den iFrame zu ändern. width Wert zu 100%Behalten Sie eine feste Höhe bei, die zur gewählten Ansicht passt. Eine einfache responsive Version sieht so aus:
<div style="width:100%; overflow:hidden;">
<iframe
src="YOUR-GOOGLE-CALENDAR-EMBED-URL"
style="border:0;"
width="100%"
height="600"
frameborder="0"
scrolling="no">
</iframe>
</div>Behalten Sie die Einbettungs-URL aus dem von Google für Ihren Kalender generierten Code bei. Ersetzen Sie lediglich die Breite, Höhe oder den umgebenden Rahmen. Selbst wenn der iFrame optimal in seinen Container passt, kann eine Monatsübersicht auf einem Smartphone immer noch überladen wirken.
Für ein Publikum, das viel mobil unterwegs ist, sollten Sie neben der Monatsansicht auch die Termin- bzw. Agendaansicht testen.
Ein Standard-iFrame lässt sich schnell veröffentlichen, sein Layout und seine interaktiven Funktionen werden jedoch weiterhin von Google Kalender gesteuert.
Wie füge ich Google Kalender zu WordPress.com hinzu?
WordPress.com bietet auf unterstützten Websites einen Google Kalender-Block an. Fügen Sie diesen Block hinzu, fügen Sie den gleichen iFrame-Code wie in Google Kalender ein, klicken Sie auf „Einbetten“ und sehen Sie sich die Seite in einem neuen Tab in der Vorschau an.
Auf einer selbstgehosteten WordPress.org-Website wird dieser Block möglicherweise nicht angezeigt, es sei denn, Jetpack stellt ihn bereit. Die Methode mit benutzerdefiniertem HTML funktioniert auch ohne diesen Block und ist in der Regel der kürzeste Weg.
Im aktuellen Support-Leitfaden von WordPress.com wird auch darauf hingewiesen, dass Themes möglicherweise Optionen für die Ausrichtung des Kalenderblocks in breiter und voller Breite bieten.
Wann sollten Sie stattdessen Google Kalender-Ereignisse importieren?
Importieren Sie Events, wenn die Website die Präsentation und das Event-Erlebnis selbst gestalten soll.
Ein iFrame zeigt einen von Google gehosteten Kalender an. Ein importiertes Ereignis kann zu einem WordPress-Inhalt mit eigener URL, Bild, Organisator, Ort, Layout und, sofern unterstützt, Buchungs- oder Ticketoptionen werden.
Diese Unterscheidung ist für Eventagenturen wichtig. Ein Stundenplan oder ein Büroverfügbarkeitskalender kann als iFrame problemlos funktionieren. Konferenzzentren, Fitnessstudios, Veranstaltungsorte oder Schulungsanbieter benötigen hingegen oft detaillierte Veranstaltungsseiten, die optisch zum Rest der Website passen.
Wenn Sie noch unentschlossen sind, welche Kontrollmöglichkeit die richtige ist, lesen Sie „WordPress Custom Calendar Maker: 4 Wege, Ihren eigenen Kalender zu erstellen“ . Dort werden Einbettungen mit nativen Tabellen, gehosteten Planungstools und WordPress-Event-Plugins verglichen.
Durch den Import wird ein Kalendereintrag in Inhalt umgewandelt, den WordPress als Ereignis anzeigen und verwalten kann.
Wie importiert man Google Kalender-Ereignisse mit MEC?
MEC importiert Ereignisse über die Google Kalender-Importseite mithilfe eines Google API-Schlüssels und der Kalender-ID. Die verfügbaren Optionen können je nach MEC-Version und Add-ons variieren. Prüfen Sie daher Ihre installierte Version, bevor Sie einen wiederkehrenden Workflow planen.
- Installieren und aktivieren Sie MEC Lite oder MEC Pro.
- Aktivieren Sie in Google Cloud die Google Calendar API und erstellen Sie einen API-Schlüssel für die Website.
- Kopieren Sie in Google Kalender die Kalender-ID von Einstellungen und Freigabe > Kalender integrieren.
- In WordPress öffnen ME Kalender > Import/Export > Google Kalender importieren.
- Geben Sie den API-Schlüssel und die Kalender-ID ein und wählen Sie anschließend den abzurufenden Datumsbereich aus.
- Klicken Sie auf StartWählen Sie die benötigten Ereignisse aus und importieren Sie sie in die MEC-Ereignisliste.
- Erstellen oder wählen Sie einen MEC-Shortcode aus und platzieren Sie ihn auf der Seite, auf der der Kalender erscheinen soll.
Laut MEC-Dokumentation muss der Google-Kalender für diesen Importweg öffentlich sein. Außerdem wird empfohlen, die Zeitzone in WordPress und Google Kalender abzugleichen, insbesondere wenn ein 403- oder 404-Fehler oder eine falsche Ereigniszeit auftritt.
Sie müssen außerdem sicherstellen, dass der Kalender, aus dem Sie importieren, öffentlich ist.
Wählen Sie nach dem Import ein Kalenderlayout, das zum Inhalt passt, anstatt alle Ereignisse in ein Monatsraster einzuordnen. MEC unterstützt Page-Builder wie Gutenberg, Elementor und Divi.
Wenn Ihr Kalender Teil einer gestalteten Landingpage ist, prüfen Sie die verfügbaren Möglichkeiten zur Verwendung von Elementor mit MEC und den anderen unterstützten Builder-Optionen, bevor Sie sich für ein Add-on entscheiden.
Können Google Kalender und WordPress synchronisiert bleiben?
Ja, aber „synchronisieren“ kann Verschiedenes bedeuten.
Der iFrame zeigt immer eine von Google gehostete Ansicht an, daher muss nichts erneut importiert werden. Ein importiertes WordPress-Ereignis ist ein separater Datensatz und benötigt einen geplanten Import- oder Synchronisierungsprozess, um spätere Änderungen zu übernehmen.
Die Import- und Exportdokumentation von MEC umfasst auch die Planung von Google Kalender-Aufgaben mithilfe von Cronjobs. Der Host muss Cronjobs unterstützen, und der zugehörige Google Kalender-Import bzw. -Export muss bereits konfiguriert sein.
MECs Advanced Importer Das Add-on kann auch Verbindungen zu Diensten wie Google, Facebook, Meetup und Eventbrite herstellen und ermöglicht Administratoren die Planung von Importen. Überprüfen Sie die Richtung und das Intervall, die Ihre Konfiguration erfordert, bevor Sie sich bei kurzfristigen Änderungen darauf verlassen.
Geplante Importe reduzieren doppelte Dateneingaben, der Zeitpunkt hängt jedoch von der konfigurierten Aufgabe und der Cron-Unterstützung der Website ab.
Google Kalender-Einbettung oder MEC: Was ist der praktische Unterschied?
| Capability | Google iFrame | MEC-Ereignisimport |
|---|---|---|
| Aufbauzeit | Ein paar Minuten | Länger, da API und Anzeige konfiguriert werden müssen. |
| Updates | Angezeigt aus dem von Google gehosteten Kalender | Manuell oder zeitgesteuert, je nach Konfiguration |
| Designkontrolle | Googles Einbettungsoptionen | WordPress-Layouts, Shortcodes und unterstützte Builder |
| Event-URLs auf Ihrer Domain | Nein | Ja |
| Ausgewählte Bilder, Organisatoren und Orte | Beschränkt auf das, was die Einbettung anzeigt | Als Veranstaltungsinhalt verwaltet |
| Buchungen und Ticketing | Nicht in die Kalendereinbettung integriert | Verfügbar mit den entsprechenden MEC-Funktionen oder Add-ons |
| Optimale Bildschirmwahl | Ein Zeitplan, den die Leute sehen müssen | Veranstaltungen, die Menschen entdecken, öffnen, buchen oder kaufen müssen |
Warum funktioniert der integrierte Kalender nicht?
Die meisten Fehler entstehen durch Kalenderberechtigungen, den falschen WordPress-Block, die falsche Containergröße, Caching-Probleme oder nicht übereinstimmende Zeitzonen. Überprüfen Sie diese Punkte, bevor Sie die Einbettung ersetzen oder ein anderes Plugin installieren.
Wenn MEC beim Import einen 403- oder 404-Fehler zurückgibt: Überprüfen Sie die Einstellungen für den öffentlichen Kalender, den Status der Google Calendar API, die API-Schlüsselbeschränkungen und die Kalender-ID. Folgen Sie uns außerdem in den sozialen Medien, um auf dem Laufenden zu bleiben.
Der Kalender ist leer oder fordert Besucher zur Anmeldung auf: Bestätigen Sie, dass der Kalender öffentlich ist oder mit jedem beabsichtigten Betrachter geteilt wird.
Der iFrame-Code wird als Text angezeigt: Fügen Sie ihn in einen benutzerdefinierten HTML-Block ein, nicht in einen Absatz- oder Codeblock.
Der Kalender ist abgeschnitten: Legen Sie die Breite des iFrames fest auf 100%Versuchen Sie es mit einem breiten oder vollflächigen Block und erhöhen Sie die Höhe.
Die mobile Ansicht ist schwer lesbar: Testen Sie die Zeitplanansicht, reduzieren Sie die angezeigten Steuerelemente oder verwenden Sie ein WordPress-Kalenderlayout, das für kleine Bildschirme entwickelt wurde.
Ereignisse werden zur falschen Zeit angezeigt: Stimmen Sie die Zeitzone in Google Kalender, WordPress und dem Import-Plugin ab.
Importierte Ereignisse haben sich nicht geändert: Überprüfen Sie die Importrichtung, den letzten Lauf, den Cron-Zeitplan und den Seitencache.
1. Kann ich einen privaten Google Kalender in WordPress einbetten?
Ein privater Kalender kann für angemeldete Personen sichtbar sein, die bereits die entsprechende Berechtigung haben. Er funktioniert jedoch nicht wie ein öffentlicher Website-Kalender.
Erstellen Sie für eine öffentliche Seite einen separaten Kalender, der nur die Ereignisse enthält, die Sie veröffentlichen möchten. Geben Sie keine geheime iCal-URL im Seitenquelltext preis.
2. Werden Google Kalender-Updates automatisch in WordPress angezeigt?
Ein iFrame lädt den von Google gehosteten Kalender, sodass Besucher beim Aktualisieren der Einbettung den aktuellen Kalender sehen.
Importierte Ereignisse sind separate WordPress-Datensätze. Sie werden nur aktualisiert, wenn Sie einen weiteren Import durchführen oder eine unterstützte geplante Synchronisierungsaufgabe konfigurieren.
3. Benötige ich ein WordPress-Plugin, um Google Kalender einzubetten?
Nein. Die kostenlose iFrame-Methode benötigt lediglich den Einbettungscode von Google Kalender und einen benutzerdefinierten HTML-Block von WordPress.
Ein Plugin ist dann nützlich, wenn Sie WordPress-Veranstaltungsseiten, eine stärkere Layoutkontrolle, Filterfunktionen, Veranstaltungsmetadaten, Buchungsfunktionen oder Ticketverkäufe benötigen.
4. Kann ich mehr als einen Google Kalender einbetten?
Ja. Mit dem Customizer von Google Kalender können Sie mehrere Kalender in einem einzigen Embed einbinden oder separate iFrames zu verschiedenen WordPress-Seiten hinzufügen.
Halten Sie öffentliche und private Termine getrennt und testen Sie die Farbkennzeichnungen und die mobile Ansicht, wenn mehrere Kalender ein gemeinsames Raster verwenden.
5. Verlangsamt die Einbettung von Google Kalender WordPress?
Der iFrame lädt Inhalte von Google erst nach dem Seitenaufbau, wodurch eine zusätzliche Anfrage von einem Drittanbieter und eine gewisse Seitengröße entstehen. Ein Kalender ist in der Regel problemlos zu handhaben.
Vermeiden Sie es, mehrere Einbettungen oberhalb der Falz zu platzieren, und testen Sie die fertige Seite mit Ihrem üblichen Performance-Tool.
6. Können Besucher in WordPress eine Veranstaltung zu ihrem eigenen Google Kalender hinzufügen?
Ja. Google gibt an, dass Besucher den Link „Zu Google Kalender hinzufügen“ am unteren Rand eines eingebetteten öffentlichen Kalenders verwenden können .
Für einzelne öffentliche Veranstaltungen bietet Google Kalender auch eine Option zum Veröffentlichen von Veranstaltungen mit HTML für eine Schaltfläche zum Hinzufügen zum Kalender.
7. Veröffentlichen Sie den einfachsten Kalender, der den Anforderungen genügt.
Für einen öffentlichen Zeitplan wird kein Plugin benötigt. Kopieren Sie den iFrame, fügen Sie ihn in einen benutzerdefinierten HTML-Block ein, passen Sie die Breite responsiv an und überprüfen Sie das Ergebnis auf einem Smartphone.
Wechseln Sie zu einem Event-Plugin, wenn der Kalender mehr leisten muss als nur Datumsangaben anzuzeigen.
Falls Ihre Besucher Veranstaltungsseiten, Filter, Buchungsfunktionen oder Tickets benötigen, testen Sie MEC mit einer kleinen Auswahl an Veranstaltungen, bevor Sie den gesamten Kalender übertragen.
Das ermöglicht Ihnen einen direkten Vergleich, ohne den laufenden Sendeablauf zu stören.
