Benötigen Sie einen professionell aussehenden Live-Kalender auf Ihrer Website, um Besucher über bevorstehende Veranstaltungen zu informieren oder einen Termin zu vereinbaren? Anstatt etwas von Grund auf neu zu erstellen oder eine benutzerdefinierte Kalender-App zu verwenden, die möglicherweise keine zukünftigen Updates erhält, warum nicht etwas verwenden, das Millionen von anderen täglich verwenden?

Wenn Sie diesen Weg gehen, können Sie einen Google-Kalender^{(Google Calendar)} in Ihre Website einbetten . Es ist auch kostenlos und einfach zu bedienen. Alles, was Sie brauchen, um loszulegen, ist ein Google- Konto.

Melden Sie^(Get) sich zunächst bei Ihrem Google -Konto an, klicken Sie auf das Apps-Raster neben Ihrem Profilbild und dann auf Kalender^(Calendar) .

Holen Sie sich den Einbettungscode^{(Get the Embed Code)}

Öffnen Sie Optionen, indem^{(Options by )} Sie auf die drei Punkte neben dem Kalender klicken, den Sie einbetten möchten.  

Klicken Sie im Popup auf Einstellungen und Freigabe .^{(Settings and sharing)}

Scrollen^(Scroll) Sie auf der Seite Kalendereinstellungen^(Calendar) nach unten , bis Sie den Abschnitt Kalender integrieren^{(Integrate calendar)} finden .

Um Ihren Kalender für alle sichtbar zu machen und nicht nur für diejenigen, mit denen Sie ihn teilen, müssen Sie ihn öffentlich machen^{( make it public)} .

Aktivieren Sie dazu unter Zugriffsberechtigungen das Kontrollkästchen neben ^{(Access permissions)}Öffentlich zugänglich machen^{(Make available to public)} .

Betten Sie den Code in den HTML -Abschnitt einer Webseite oder eines Beitrags ein. Wenn Sie beispielsweise WordPress verwenden , erstellen Sie eine neue Seite.

Klicken Sie auf Text , um zum HTML - Editor zu wechseln. Kopieren Sie den Einbettungscode^(Embed) aus Ihrem Google - Kalender und fügen Sie ihn in die Seite ein.

Klicken Sie auf die Registerkarte Visuell^{(Visual )} , um zu sehen, wie der Kalender auf Ihrer Seite aussieht. Sie können auch Vorschau^(Preview) auswählen , um es auf dem Frontend Ihrer Website anzuzeigen.

Fügen Sie den Kalender-HTML^{(Calendar HTML)} -Code in eine beliebige Webseite ein, auf der Sie Objekte einbetten dürfen.

Wenn Ihnen die Standardformateinstellungen von Google für den Kalender gefallen, können Sie loslegen. Um die Farbe, Größe und andere Optionen Ihres Kalenders zu ändern, können Sie seine Einstellungen anpassen.

Passen Sie die Google Kalender-Einstellungen an^{(Customize Google Calendar Settings)}

Klicken Sie auf die Schaltfläche Anpassen^(Customize) , die sich direkt unter dem Einbettungscode befindet. Dies öffnet ein neues Fenster.

Bearbeiten oder fügen Sie einen Titel zu Ihrem Kalender hinzu, indem Sie ihn unter Kalendertitel^{(Calendar title)} eingeben . Wenn der Titel angezeigt werden soll, aktivieren Sie das Kontrollkästchen neben Titel^(Title) .

Geben^(Specify) Sie an, welche Elemente Sie in Ihrem Kalender anzeigen möchten, indem Sie die folgenden Einstellungen unter Anzeigen aktivieren^(Show) :

• Titel
• Navigationstasten
• Daten
• Drucken-Symbol
• Registerkarten
• Kalenderliste
• Zeitzone

Die Standardgröße des Google-Kalenders^{(Google Calendar)} ist 800 x 600. Ändern Sie die Größe, indem Sie die Aufwärts- und Abwärtspfeile neben Breite^(Width) und Höhe^(Height) verschieben .

Wenn Sie beispielsweise einen Kalender in eine Seitenleiste einbetten möchten, reduzieren Sie die Breite^(Width) auf eine kleinere Größe wie 300.

Andere Einstellungen, die Sie anpassen können, sind:

• Hintergrundfarbe^(Background) passend zu Ihrer Markenfarbe
• Zeitzone und Sprache
• Rand (ein oder aus)
• Standardmonat
• Erster Tag der Woche

Nachdem Sie die Optionen angepasst haben, können Sie Ihren endgültigen Live-Kalender auf Ihrer Webseite anzeigen. Wenn Sie ein Ereignis in Ihrem Kalender ändern, wird es automatisch aktualisiert.

Unten^(Below) sehen Sie einen Screenshot der Monatsansicht.

Sie können Ihren Kalender auch nach Woche anzeigen.

Wenn Sie Änderungen vornehmen möchten, können Sie jederzeit zu Ihren Google Kalender-^{(Google Calendar)} Einstellungen zurückkehren und diese anpassen.

Stellen Sie sicher, dass Sie den neuen HTML -Code kopieren und einfügen, nachdem Sie Formatierungsaktualisierungen vorgenommen haben, um die neuen Änderungen widerzuspiegeln.

So lassen Sie Besucher ein Kalenderereignis speichern^{(How to Let Visitors Save a Calendar Event)}

Damit Besucher Ihre Veranstaltung in ihrem eigenen Google Kalender^{(Google Calendar)} speichern können , fügen Sie Ihrer Website eine Schaltfläche hinzu. Stellen Sie^(Make) sicher, dass Ihr Kalender öffentlich ist.

Öffnen Sie Ihren Google-Kalender^{(Google Calendar)} . Beachten Sie, dass Änderungen nur von einem Computer und nicht von einer mobilen App aus vorgenommen werden können.

Um ein Ereignis hinzuzufügen, wählen Sie den Tag aus, zu dem Sie es hinzufügen möchten, und klicken Sie oben links auf Erstellen .^(Create)

Geben^(Fill) Sie die Details Ihrer Veranstaltung in das Popup-Fenster ein und klicken Sie auf Speichern^(Save) .

Um ein Ereignis in Ihrem Kalender zu öffnen, doppelklicken Sie darauf. Klicken Sie dann auf die drei Punkte in der oberen rechten Ecke, um Optionen^(Options) zu öffnen , und wählen Sie Veranstaltung veröffentlichen^{(Publish event)} aus .

Betten Sie den HTML -Code aus dem Popup-Fenster auf Ihrer Website ein, damit Besucher das Ereignis zu ihrem eigenen Google-Kalender^{(Google Calendar)} hinzufügen können .

Gehen Sie zurück zu Ihrer Website und fügen Sie den Code aus der Quell- oder HTML - Ansicht dort ein, wo die Ereignisschaltfläche angezeigt werden soll.

Wenn ein Besucher auf die Google Kalender-^{(Google Calendar)} Schaltfläche klickt, wird sein Kalender geöffnet und das Ereignis hinzugefügt. Sie können auch Personen zu Ihrer Veranstaltung einladen, indem Sie den Link verwenden, der im selben Popup-Fenster angezeigt wird.

Betten Sie Google Kalender mithilfe von Plugins in WordPress ein^{(Embed Google Calendar into WordPress Using Plugins)}

Wie bei den meisten Funktionen in WordPress gibt es dafür ein Plugin. Das Einbetten eines Google-Kalenders^{(Google Calendar)} in eine WordPress- Website ist da keine Ausnahme. Nachfolgend finden Sie einige WordPress- Plugins, die Sie verwenden sollten. 

Einfaches Kalender-Plugin^{(Simple Calendar Plugin)}

Der einfache Kalender^{(Simple Calendar)} zeigt Ihre Ereignisse nach Woche, Monat oder in einer Liste an. Es ist einfach einzurichten, reagiert auf Mobilgeräte und kann an Ihre Bedürfnisse angepasst werden.

Weitere Merkmale sind: 

• Verwalten Sie Ereignisse in Google und lassen Sie sie automatisch in WordPress aktualisieren^(WordPress)
• Farbcode-Ereignisse
• Intuitiv und einfach zu konfigurieren
• Zusätzliche Funktionalität mit Add-Ons

Dieses Plugin ist eine ausgezeichnete Wahl für Power-User von Google Kalender . ^{(Google Calendar)}Eine einzigartige Funktion ist die Möglichkeit, farbcodierte Ereignisse zu übertragen.

Dans Embedder für Google Kalender^{(Dan’s Embedder for Google Calendar)}

Zeigen Sie Google^{(Display Google)} Kalender in einer Liste oder Vollansicht mit Dan's Embedder für Google Kalender^{(Google Calendar)} an .

Es ist nicht erforderlich, Ereignisse in WordPress zu verwalten oder zu importieren . Sie benötigen lediglich einen oder mehrere öffentliche Google-Kalender^{(Google Calendars)} . Weitere Merkmale sind:

• Konfigurieren Sie Optionen mit Shortcodes
• Geben Sie an, wie viele Elemente angezeigt werden sollen
• Betten Sie mehrere Kalender ein 

Dieses Plugin erfordert einen API - Schlüssel. Befolgen Sie die nachstehenden Schritte, um Ihre zu erhalten:

• Besuchen Sie die Google Developers Console
• Aktivieren Sie im Seitenmenü APIs und Authentifizierung^{(APIs and auth)} > Anmeldeinformationen^(Credential)
• Klicken Sie im Abschnitt Öffentlicher API-^{(Public API)} Zugriff auf die Schaltfläche Neuen Schlüssel erstellen^{(Create new key)}
• Wählen Sie Browserschlüssel^{(Browser key)} und lassen Sie Referrer-Beschränkung^{(Referrer Limitation)} leer
• Setzen Sie diesen Schlüssel auf die Seite mit den Plugin-Einstellungen

Veranstaltungskalender WD^{(Event Calendar WD)}

Erstellen Sie mit ^(Create)Event Calendar WD eine Event-Promotion und verwalten oder fügen Sie Events zu Ihrem WordPress - Blog hinzu .

Geben Sie mithilfe des WordPress-^(WordPress) Editors eine detaillierte Beschreibung Ihrer Veranstaltungen an, fügen Sie Tags hinzu und weisen Sie jeder Kategorie Kategorien zu. Einige andere Funktionen umfassen:

• Benutzerfreundliche Oberfläche für volle Kontrolle darüber, wie Sie Kalender und Ereignisse auf Ihrer Website anzeigen
• Passen Sie Ihre Kalender ganz einfach an und verwalten Sie sie
• Eine unbegrenzte Anzahl von Kalendern und Ereignissen
• Optimieren Sie jede Veranstaltung für eine bessere SEO und Sichtbarkeit in Suchmaschinen
• Aktivieren Sie Social-Sharing-Schaltflächen, um Ihre Veranstaltungen bekannt zu machen

WP Einfacher Buchungskalender^{(WP Simple Booking Calendar)}

^(Quickly)Installieren und betten Sie Google Kalender ^{(Google Calendars)}schnell und einfach auf Ihrer Website ein.

Die kostenlose Version von WP Simple Booking Calendar bietet Ihnen Zugriff auf die grundlegenden Funktionen, die Sie benötigen, wie z. B. das Verfolgen Ihrer Veranstaltungen. Zu den Highlights der kostenlosen Version gehören:

• Responsives Layout
• ^(Backup)Daten und Kalender sichern und wiederherstellen
• Zeigen Sie Ihre Verfügbarkeit an 

Für erweiterte Veröffentlichungs- und Bearbeitungsfunktionen können Sie auf die Premium- Version upgraden.

Benutzer, die ihre Verfügbarkeit für ihre Dienste auf ihrer Website verwalten und anzeigen oder anstehende Veranstaltungen ankündigen möchten, profitieren stark von der Einbettung eines Google-Kalenders^{(Google Calendar)} auf ihrer Website.

Die direkte Integration eines Kalenders auf Ihrer Website hält Besucher auf Ihrer Website und erhöht die Wahrscheinlichkeit, dass sie einen Termin vereinbaren oder sich für eine Veranstaltung anmelden.

Sie benötigen lediglich eine Internetverbindung, einen Webbrowser und ein Google -Konto, um einen professionell aussehenden Kalender auf Ihrer Website zu erstellen und anzuzeigen.

How To Embed Google Calendar On Your Website

Do you need a profеssional-looking live calеndar on your website to let νisitorѕ know about upcoming events or to schеdule an appointment? Instead of building something from scratch or using ѕome custom сalеndar app that might not get futυre updates, why not use something thаt millions of others are using on a daily basis?

Going that route, you can embed a Google Calendar onto your site. It’s also free and easy to use. All you need to get started is a Google account.

Get started by logging into your Google account, click on the apps grid next to your profile picture and click on Calendar.

Get the Embed Code

Open Options by clicking on the three dots adjacent to the calendar you want to embed.  

Click on Settings and sharing from the popup.

Scroll down the Calendar settings page until you find the Integrate calendar section.

To make your calendar visible to everyone and not only those you share it with, you will need to make it public.

To do this, enable the box next to Make available to public under Access permissions.

Embed the code into the HTML section of a web page or post. For example, if you are using WordPress, create a new page.

Click on Text to switch to the HTML editor. Copy the Embed code from your Google calendar and paste it into the page.

Click on the Visual tab to see what the calendar looks like on your page. You can also select Preview to see it on the front end of your website.

Paste the Calendar HTML code into any web page where you’re allowed tto embed objects.

If you like Google’s default format settings for the calendar, you’re good to go. To change the color, size, and other options of your calendar, you can customize its settings.

Customize Google Calendar Settings

Click the Customize button located directly under the embed code. This will open a new window.

Edit or add a title to your calendar by typing it under Calendar title. If you want the title to show, enable the box next to Title.

Specify which elements you want to show on your calendar by checking the following settings under Show:

• Title
• Navigation buttons
• Data
• Print icon
• Tabs
• Calendar list
• Time Zone

The default size of the Google Calendar is 800 by 600. Change the size by moving the up and down arrows next to Width and Height.

For example, if you want to embed a calendar on a sidebar, reduce the Width to a smaller size such as 300.

Other settings you can customize include:

• Background color to match your brand color
• Time zone and language
• Border (on or off)
• Default month
• First day of the week

After you customize the options, view your final live calendar on your web page. When you change an event on your calendar, it will update automatically.

Below is a screenshot of the monthly view.

You can also view your calendar by week.

If you want to make any changes, you can always go back to your Google Calendar settings and adjust them..

Be sure to copy and paste the new HTML code after making any formatting updates  to reflect the new changes.

How to Let Visitors Save a Calendar Event

To enable visitors to save your event on their own Google Calendar, add a button to your website. Make sure your calendar is public.

Open your Google Calendar. Note that changes can only be made from a computer and not a mobile app.

To add an event, select the day you want to add it to and click on Create in the top left-hand corner.

Fill in the details of your event in the popup and click Save.

To open an event in your calendar, double-click it. Then click the three dots in the upper right-hand corner to open Options, and select Publish event.

Embed the HTML code from the popup window on your website to enable visitors to add the event to their own Google Calendar.

Go back to your website and paste the code from the source or HTML view where you want the event button to display.

When a visitor clicks on the Google Calendar button, it will open their calendar and add the event to it. You can also invite people to your event using the link displayed in the same popup window.

Embed Google Calendar into WordPress Using Plugins

As with most functions in WordPress, there is a plugin for that. Embedding a Google Calendar into a WordPress website is no exception. Below are several WordPress plugins for you to consider using. 

Simple Calendar Plugin

Simple Calendar shows your events by week, month, or in a list. It’s easy to set up, mobile responsive, and customizable to your needs.

Other features include: 

• Manage events in Google and have them updated automatically in WordPress
• Color code events
• Intuitive and straightforward to configure
• Additional functionality with add-ons

This plugin is an excellent choice for Google Calendar power users. One unique feature is the ability to transfer color-coded events.

Dan’s Embedder for Google Calendar

Display Google calendars in a list or full view with Dan’s Embedder for Google Calendar.

There is no need to manage or import events in WordPress. You only need one or more public Google Calendars. Other features include:

• Configure options with shortcodes
• Specify how many items to show
• Embed multiple calendars 

This plugin requires an API key. Follow the steps below to get yours:

• Visit Google Developers Console
• From the side menu, check APIs and auth > Credential
• Click the Create new key button from the Public API access section
• Select Browser key and leave Referrer Limitation blank
• Put this key on the plugin settings page

Event Calendar WD

Create an event promotion and manage or add events to your WordPress blog with Event Calendar WD.

Provide a detailed description of your events using the WordPress editor, attach tags, and assign categories to each one. Some other features include:

• User-friendly interface for full control over how you display calendars and events on your website
• Easily customize and manage your calendars
• An unlimited number of calendars and events
• Optimize every event for better SEO and search engine visibility
• Enable social sharing buttons to spread the word about your events

WP Simple Booking Calendar

Quickly and easily install and embed Google Calendars on your website.

The free version of WP Simple Booking Calendar gives you access to the basic features you need such as keeping track of your events. Highlights of the free version include:

• Responsive layout
• Backup and restore data and calendars
• Display your availability 

For more advanced publishing and editing functions, you can upgrade to the Premium version.

Users who want to manage and display their availability for their services on their website or announce upcoming events will benefit greatly from embedding a Google Calendar on their site.

Integrating a calendar directly on your website will keep visitors on your site and increase the chances they’ll make an appointment or sign up for an event.

All you need is an internet connection, a web browser, and a Google account to create and display a professional-looking calendar on your site.

Related posts

• So betten Sie Google-Formulare auf Ihrer Website ein

• So verwenden Sie Google Kalender: 10 Profi-Tipps

• So verwenden Sie den Google-Familienkalender, um Ihre Familie pünktlich zu halten

• 2 Shortcuts für die Chrome-Adressleiste zum Erstellen von Google Kalender-Ereignissen

• Google Analytics-Benutzerforschungsmethoden zur Steigerung des Website-Verkehrs

• Was ist die Google-App und wie wird sie verwendet?

• Google-Suchleisten-Widget fehlt? So stellen Sie es auf Android wieder her

• So teilen Sie einen Google-Kalender

• So sichern Sie den Google Chrome-Verlauf

• 10 Google Kalender-Tipps, um Ihren Terminstress zu verringern

• Was ist das Software Reporter Tool in Chrome und wie wird es deaktiviert?

• 9 versteckte Funktionen in Google Maps, die Sie sich ansehen sollten

• Können Sie alle E-Mails auf einmal aus Google Mail löschen?

• 8 Tipps zur Google-Suche: Finden Sie immer, wonach Sie suchen

• Warum Google Kalender der beste Online-Kalenderdienst ist

• So richten Sie Voicemail auf Google Voice ein

• Was ist ein Google-Fehler „ungewöhnlicher Datenverkehr“ und wie kann er behoben werden?

• Die 7 besten Google Mail-Add-Ons

• So verwenden Sie Google Tasks – Erste Schritte

• Erhalten Sie keine Gmail-Benachrichtigungen? 10 Möglichkeiten zur Behebung