Avez-vous besoin d'un calendrier en direct d'aspect professionnel sur votre site Web pour informer les visiteurs des événements à venir ou pour planifier un rendez-vous ? Au lieu de créer quelque chose à partir de zéro ou d'utiliser une application de calendrier personnalisée^{(custom calendar app)} qui pourrait ne pas recevoir de futures mises à jour, pourquoi ne pas utiliser quelque chose que des millions d'autres utilisent quotidiennement ?

En suivant cette voie, vous pouvez intégrer un agenda Google^{(Google Calendar)} sur votre site. Il est également gratuit et facile à utiliser. Tout ce dont vous avez besoin pour commencer est un compte Google^{(Google account)} .

Commencez^(Get) par vous connecter à votre compte Google^{(Google account)} , cliquez sur la grille des applications à côté de votre photo de profil et cliquez^{(picture and click)} sur Calendrier^(Calendar) .

Obtenir le code d'intégration^{(Get the Embed Code)}

Ouvrez Options en^{(Options by )} cliquant sur les trois points adjacents au calendrier que vous souhaitez intégrer.  

Cliquez sur Paramètres et partage^{(Settings and sharing)} dans la fenêtre contextuelle.

Faites défiler^(Scroll) la page des paramètres du calendrier jusqu'à ce que vous trouviez la section ^(Calendar)Intégrer le calendrier^{(Integrate calendar)} .

Pour rendre votre calendrier visible par tout le monde et pas seulement par ceux avec qui vous le partagez, vous devrez le rendre public^{( make it public)} .

Pour ce faire, cochez la case à côté de Rendre accessible au public^{(Make available to public)} sous Autorisations d'accès^{(Access permissions)} .

Intégrez le code dans la section HTML^{(HTML section)} d'une page Web ou d'un article^{(page or post)} . Par exemple, si vous utilisez WordPress , créez une nouvelle page.

Cliquez sur Texte^{(Text )} pour passer à l' éditeur HTML^{(HTML editor)} . Copiez le code^{(Embed code)} d'intégration de votre calendrier Google et collez^{(Google calendar and paste)} -le dans la page.

Cliquez sur l' onglet Visuel^{(Visual )} pour voir à quoi ressemble le calendrier sur votre page. Vous pouvez également sélectionner Aperçu^(Preview) pour le voir sur le front-end de votre site Web.

Collez le code HTML du calendrier^{(Calendar HTML code)} dans n'importe quelle page Web où vous êtes autorisé à incorporer des objets.

Si vous aimez les paramètres de format par défaut de Google pour le calendrier, vous êtes prêt à partir. Pour modifier la couleur, la taille et d'autres options de votre calendrier, vous pouvez personnaliser ses paramètres.

Personnaliser les paramètres de Google Agenda^{(Customize Google Calendar Settings)}

Cliquez sur le bouton Personnaliser^(Customize) situé directement sous le code d'intégration. Cela ouvrira une nouvelle fenêtre.

Modifiez ou ajoutez un titre à votre calendrier en le saisissant sous Titre du calendrier^{(Calendar title)} . Si vous voulez que le titre s'affiche, cochez la case à côté de Titre^(Title) .

Spécifiez^(Specify) les éléments que vous souhaitez afficher sur votre calendrier en cochant les paramètres suivants sous Afficher^(Show) :

• Titre
• Boutons de navigation
• Données
• Icône d'impression
• Onglets
• Liste des calendriers
• Fuseau horaire

La taille par défaut^{(default size)} de Google Agenda^{(Google Calendar)} est de 800 sur 600. Modifiez la taille en déplaçant les flèches vers le haut et vers le bas à côté de Largeur^(Width) et Hauteur^(Height) .

Par exemple, si vous souhaitez intégrer un calendrier dans une barre latérale, réduisez la largeur^(Width) à une taille plus petite telle que 300.

Les autres paramètres que vous pouvez personnaliser incluent :

• Couleur de fond assortie à la couleur^{(Background color)} de votre marque^{(brand color)}
• Fuseau horaire et langue
• Bordure (activée ou désactivée)
• Mois par défaut
• Premier jour de la semaine

Après avoir personnalisé les options, affichez votre calendrier en direct^{(live calendar)} final sur votre page Web. Lorsque vous modifiez un événement sur votre calendrier, il se met à jour automatiquement.

Vous trouverez ci^(Below) -dessous une capture d'écran de la vue mensuelle.

Vous pouvez également afficher votre calendrier par semaine.

Si vous souhaitez apporter des modifications, vous pouvez toujours revenir à vos paramètres Google Agenda^{(Google Calendar)} et les ajuster.

Assurez-vous de copier et coller le nouveau code HTML^{(HTML code)} après avoir effectué les mises à jour de mise en forme pour refléter les nouvelles modifications.

Comment permettre aux visiteurs d'enregistrer un événement de calendrier^{(How to Let Visitors Save a Calendar Event)}

Pour permettre aux visiteurs d'enregistrer votre événement dans leur propre agenda Google^{(Google Calendar)} , ajoutez un bouton à votre site Web. Assurez^(Make) -vous que votre calendrier est public.

Ouvrez votre agenda Google^{(Google Calendar)} . Notez que les modifications ne peuvent être effectuées qu'à partir d'un ordinateur et non d'une application mobile.

Pour ajouter un événement, sélectionnez le jour auquel vous souhaitez l'ajouter et cliquez sur Créer^(Create) dans le coin supérieur gauche.

Remplissez^(Fill) les détails de votre événement dans la fenêtre contextuelle et cliquez sur ^{(popup and click)} Enregistrer^(Save) .

Pour ouvrir un événement dans votre calendrier, double-cliquez dessus. Cliquez ensuite sur les trois points dans le coin supérieur droit^{(right-hand corner)} pour ouvrir Options , puis sélectionnez Publier l'événement^{(Publish event)} .

Intégrez le code HTML^{(HTML code)} de la fenêtre contextuelle^{(popup window)} sur votre site Web pour permettre aux visiteurs d'ajouter l'événement à leur propre agenda Google^{(Google Calendar)} .

Retournez sur votre site Web et collez^{(website and paste)} le code de la source ou^{(source or HTML)} de la vue HTML à l'endroit où vous souhaitez que le bouton^{(event button)} d'événement s'affiche.

Lorsqu'un visiteur clique sur le bouton Google Calendar^{(Google Calendar button)} , il ouvre son calendrier et y ajoute l'événement. Vous pouvez également inviter des personnes à votre événement en utilisant le lien affiché dans la même fenêtre contextuelle^{(popup window)} .

Intégrer Google Calendar dans WordPress à l'aide de plugins^{(Embed Google Calendar into WordPress Using Plugins)}

Comme pour la plupart des fonctions de WordPress , il existe un plugin pour cela. L'intégration d'un calendrier Google^{(Google Calendar)} dans un site Web WordPress^{(WordPress website)} ne fait pas exception. Vous trouverez ci-dessous plusieurs plugins WordPress que vous pouvez envisager d'utiliser. 

Plug-in de calendrier simple^{(Simple Calendar Plugin)}

Simple Calendar affiche vos événements par semaine, par mois ou dans une liste. Il est facile à configurer, adapté aux mobiles et personnalisable selon vos besoins.

Les autres fonctionnalités incluent : 

• Gérez les événements dans Google et mettez-les à jour automatiquement dans WordPress
• Événements de code couleur
• Intuitif et simple à configurer
• Fonctionnalités supplémentaires avec des add-ons

Ce plugin est un excellent choix pour les utilisateurs expérimentés de Google Calendar^{(Google Calendar power)} . Une caractéristique unique est la possibilité de transférer des événements codés par couleur.

Dan's Embedder pour Google Agenda^{(Dan’s Embedder for Google Calendar)}

Affichez les^{(Display Google)} calendriers Google dans une liste ou en vue complète avec Dan's Embedder pour Google Calendar .

Il n'est pas nécessaire de gérer ou d'importer des événements dans WordPress . Vous n'avez besoin que d'un ou plusieurs agendas Google^{(Google Calendars)} publics . Les autres fonctionnalités incluent :

• Configurer les options avec des shortcodes
• Spécifiez le nombre d'éléments à afficher
• Intégrer plusieurs calendriers 

Ce plugin nécessite une clé API^{(API key)} . Suivez les étapes ci-dessous pour obtenir le vôtre :

• Visitez la console des développeurs Google^{(Google Developers Console)}
• Dans le menu latéral, cochez API et authentification^{(APIs and auth)} > Credential
• Cliquez sur le bouton Créer une nouvelle clé^{(Create new key)} dans la section Accès à l'API publique^{(Public API access)}
• Sélectionnez la clé du navigateur^{(Browser key)} et laissez la limite de référence^{(Referrer Limitation)} vide
• Mettez cette clé sur la page des paramètres du plugin

Calendrier des événements WD^{(Event Calendar WD)}

Créez^(Create) une promotion d'événement et gérez^{(event promotion and manage)} ou ajoutez des événements à votre blog WordPress^{(WordPress blog)} avec Event Calendar WD .

Fournissez une description détaillée de vos événements à l'aide de l' éditeur WordPress^{(WordPress editor)} , joignez des balises et attribuez des catégories à chacun. Certaines autres fonctionnalités incluent :

• Interface conviviale pour un contrôle total sur la façon dont vous affichez les calendriers et les événements sur votre site Web
• Personnalisez et gérez facilement vos calendriers
• Un nombre illimité d'agendas et d'événements
• Optimisez chaque événement pour un meilleur référencement et une meilleure visibilité sur les moteurs de recherche^{(SEO and search engine visibility)}
• Activez les boutons de partage sur les réseaux sociaux pour faire connaître vos événements

Calendrier de réservation simple WP^{(WP Simple Booking Calendar)}

^(Quickly)Installez et intégrez rapidement et facilement Google Agendas^{(Google Calendars)} sur votre site Web.

La version gratuite de WP Simple Booking Calendar vous donne accès aux fonctionnalités de base dont vous avez besoin, telles que le suivi de vos événements. Les points forts de la version gratuite incluent^{(version include)} :

• Mise en page réactive
• Sauvegarder^(Backup) et restaurer des données et des calendriers
• Affichez vos disponibilités 

Pour des fonctions de publication et d'édition plus avancées, vous pouvez passer à la version Premium^{(Premium version)} .

Les utilisateurs qui souhaitent gérer et afficher leur disponibilité pour leurs services sur leur site Web ou annoncer^{(website or announce)} des événements à venir bénéficieront grandement de l'intégration d'un calendrier Google^{(Google Calendar)} sur leur site.

L'intégration d'un calendrier directement sur votre site Web gardera les visiteurs sur votre site et augmentera les chances qu'ils prennent rendez-vous ou s'inscrivent à un événement.

Tout ce dont vous avez besoin est une connexion Internet, un navigateur Web^{(web browser)} et un compte Google^{(Google account)} pour créer et afficher un calendrier de qualité professionnelle sur votre site.

How To Embed Google Calendar On Your Website

Do you need a professional-looking live calendar on your website to let viѕitors know about upcoming events or to schedule an appointment? Instead of building something from scratсh or using some сustom calendar app that might not get future updates, why not use something that millions of others are uѕing 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

• Comment 08206224 sur Your Website

• Comment utiliser Google Calendar: 10 Pro Tips

• Comment utiliser Google Family Calendar pour garder votre Family sur Time

• 2 raccourcis de barre d'adresse Chrome pour créer des événements Google Calendar

• Méthodes de recherche d'utilisateurs de Google Analytics pour augmenter le trafic du site Web

• Comment partager un agenda Google

• Comment faire un Line Graph dans Google feuilles

• Comment 08676335

• Quel est le Software Reporter Tool dans Chrome and How pour le désactiver

• 23 raccourcis clavier pratiques pour Google Agenda

• Comment arriver à Inbox Zero dans Gmail

• Comment supprimer YouTube History and Search Activity

• Comment faire un Business Card dans Google Drive

• Comment tourner Google SafeSearch Off

• Ne pas obtenir Gmail Notifications? 10 Ways pour réparer

• Ce qui est amélioré Protection dans Google Chrome and How pour l'activer

• Pouvez-vous supprimer tous les emails de Gmail à la fois?

• Comment faire un Google Form: A Complete Guide

• 3 façons de Create Borders dans Google Docs

• Comment configurer Voicemail sur Google Voice