Dernières nouvelles de SeedProd

Tutoriels, astuces et ressources WordPress pour développer votre activité

Comment intégrer des événements Facebook sur WordPress

Comment intégrer des événements Facebook sur WordPress 

Écrit par : image de l'auteur Stacey Corrin
image de l'auteur Stacey Corrin
Stacey écrit sur WordPress et le marketing numérique depuis plus de 10 ans et sur d'autres sujets depuis bien plus longtemps. Parallèlement, elle est fascinée par la conception de sites web, l'expérience utilisateur et le référencement.
     Reviewed By : John Turner
image du réviseur John Turner
John Turner est le cofondateur de SeedProd. Il a plus de 20 ans d'expérience dans le domaine des affaires et du développement et ses plugins ont été téléchargés plus de 25 millions de fois.

Vous cherchez un moyen simple d'intégrer des événements Facebook sur WordPress ?

Facebook est un excellent moyen d'organiser des événements professionnels grâce à ses fonctions de médias sociaux intégrées. Cependant, les visiteurs du site web peuvent facilement manquer vos événements si vous ne les ajoutez pas à votre site web.

Dans cet article, nous vous montrerons comment intégrer facilement les événements de la page Facebook sur votre site WordPress pour obtenir un flux d'événements qui améliore votre portée et votre engagement.

Pourquoi intégrer des événements Facebook sur WordPress ?

Facebook Events is a feature on Facebook that allows you to create and share announcements for upcoming events. Embedding these events on your WordPress website is an excellent way to:

  • Promote upcoming events: If you’re hosting events on Facebook, embedding them on your website can help promote them to a wider audience. When import social events onto your site, you’re making it easy for visitors to see what events you’re hosting, when they’re happening, and how they can participate.
  • Increase engagement: By embedding a Facebook event calendar, you provide visitors with a more interactive experience. Visitors can RSVP to events directly from the events calendar on your website, which can increase engagement and participation.
  • Gagnez du temps dans la gestion des événements : L'importation d'événements Facebook permet de gagner du temps en éliminant la nécessité de créer des pages d'événements distinctes sur votre site. Au lieu de cela, vous pouvez simplement intégrer l'événement en une seule fois sur votre site, en le mettant automatiquement à jour au fur et à mesure que vous y apportez des modifications sur votre compte Facebook.
  • Show social proof: By displaying events on your website, you provide proof that your events are popular and well-attended. This can build trust with visitors, increase conversions, and encourage them to attend your events.
  • Customize how they look: You can display Facebook events in a variety of ways, allowing you to customize them to fit your brand and WordPress theme. You can display the event in a calendar view or a list view and customize the colors and fonts to match your website.

Comment intégrer des événements Facebook sur WordPress

Dans ce tutoriel, nous partagerons 3 méthodes pour utiliser les événements Facebook et les ajouter à WordPress.

La première méthode vous montre comment ajouter des événements à une page d'atterrissage WordPress dédiée. C'est un excellent moyen d'éliminer les distractions et d'encourager les visiteurs à s'inscrire à votre événement.

La deuxième méthode consiste à utiliser un plugin Facebook Feed pour afficher les événements n'importe où sur votre site. Et comme ce plugin offre des tonnes d'options de personnalisation, vous avez un contrôle total sur l'apparence des événements.

Enfin, la troisième méthode consiste à ajouter du code à votre site web à partir de la page des développeurs Facebook. Bien que cette méthode soit assez simple pour les utilisateurs qui ne souhaitent pas utiliser un plugin d'événements, elle manque d'options de personnalisation pour que votre calendrier d'événements soit attrayant.

Quelle méthode vous convient le mieux ?

Si vous avez du mal à choisir une méthode, voici un tableau comparatif présentant les avantages et les inconvénients de chacune d'entre elles :

MéthodePour
Cons
Meilleur pour
SeedProdFacile à utiliser, pas de code, idéal pour les pages d'atterrissage, personnalisable.Blocage payant des pages Facebook, limité aux pages d'atterrissage.Pages d'atterrissage dédiées aux événements.
Ballon SmashHautement personnalisable, nombreuses options, adapté aux mobiles.Complexe pour les débutants, payant pour les fonctionnalités complètes.Flux d'événements Facebook complet avec de nombreuses possibilités de personnalisation.
Intégration manuelle (code)Gratuit, aucun plugin n'est nécessaire.Personnalisation limitée, nécessite des connaissances en codage, peut ne pas être adapté aux mobiles.Affichage simple, pas de plugins supplémentaires, pas de problème avec le code.

Méthode 1. Intégrer des événements Facebook sur WordPress avec SeedProd

SeedProd meilleur plugin de page d'atterrissage WordPress

SeedProd est le meilleur constructeur de pages WordPress par glisser-déposer, avec les fonctionnalités "coming soon" et "maintenance mode". Vous pouvez utiliser ce plugin pour créer des pages d'atterrissage à fort taux de conversion sans avoir à écrire du code CSS et PHP ou à embaucher un développeur.

Si vous avez entendu parler d'Elementor, il fonctionne de la même manière, mais avec une interface utilisateur plus rationalisée et un accent mis sur la simplicité.

Non seulement vous pouvez utiliser des centaines de modèles dès leur sortie de la boîte, mais il comprend également des tonnes de blocs de contenu conçus pour générer des prospects pour votre entreprise.

Les blocs Facebook sont les plus remarquables, car ils vous permettent d'intégrer du contenu de médias sociaux, notamment :

Pour cette méthode, nous utiliserons le bloc Page Facebook pour ajouter des événements directement sur votre page d'atterrissage. L'avantage est qu'il n'y a pas de jetons d'accès, de shortcodes ou d'identifiants à copier et à coller.

1. Installer et activer SeedProd

Pour commencer, installez et activez le plugin SeedProd. Pour ce guide, nous utiliserons SeedProd Pro car il possède les blocs Facebook avancés dont nous avons besoin.

2. Créer une page d'atterrissage WordPress

Après avoir installé SeedProd sur votre site WordPress, vous devrez créer une nouvelle page d'atterrissage.

Heureusement, vous pouvez suivre ce guide étape par étape sur la création d'une page d'atterrissage dans WordPress pour commencer rapidement.

Ou, si vous êtes plus intéressé par une page dédiée à Facebook, suivez ce tutoriel sur la création d'une page d'atterrissage Facebook.

Une fois que le design de votre page d'atterrissage est en place, naviguez vers SeedProd " Pages et cliquez sur Editer sur la page d'atterrissage que vous avez créée en suivant notre tutoriel.

Modifiez votre page d'atterrissage seedprod

Cela ouvrira l'éditeur visuel de SeedProd, où vous pourrez ajouter vos événements.

3. Ajouter le bloc de page Facebook

Ensuite, trouvez un espace sur votre page où vous souhaitez afficher votre calendrier d'événements Facebook. Allez ensuite dans la section Blocs avancés sur la droite et trouvez le bloc Page Facebook.

Ajouter le bloc de la page Facebook de SeedProd

Pour ajouter ce bloc à votre page, faites-le glisser de la gauche vers votre aperçu.

Ensuite, dans les paramètres de contenu du bloc de la page Facebook, vous pouvez ajouter l'URL de votre page Facebook.

Entrez l'URL de votre page Facebook

Par défaut, SeedProd affiche automatiquement la chronologie de votre page Facebook. Pour afficher vos événements à la place, cliquez sur l'option Événements sous l'onglet Onglets.

Choisissez l'option des onglets d'événements facebook

Dans le même panneau, vous pouvez également modifier le style de l'en-tête, afficher ou masquer votre photo de couverture, ajuster l'alignement, etc.

Et si vous souhaitez augmenter l'engagement de votre page Facebook, vous pouvez utiliser le bloc Facebook Embed pour intégrer une publication, une vidéo Facebook ou un commentaire directement à côté de votre programme d'événements.

4. Publier votre page d'atterrissage

Il ne reste plus qu'à cliquer sur la flèche déroulante située à côté du bouton Enregistrer dans le coin supérieur droit et à cliquer sur Publier.

Publiez votre page d'atterrissage pour les événements Facebook

Ensuite, lorsque vous cliquez sur Aperçu, vous verrez votre calendrier d'événements s'afficher sur votre page de destination.

intégrer des événements facebook sur une page d'atterrissage WordPress exemple

C'est fait. Les visiteurs du site web peuvent désormais voir vos événements Facebook sur votre page de renvoi.

Mais si vous souhaitez afficher l'intégralité d'un flux d'événements Facebook, nous vous conseillons d'utiliser la méthode suivante.

Méthode 2. Intégrer le flux Facebook dans WordPress avec Smash Balloon

smash balloon facebook feed pro

Vous devrez installer et activer le plugin Smash Balloon Custom Facebook Feed Pro pour cette méthode. Pour vous aider dans cette étape, consultez ce tutoriel pas à pas sur l'installation d'un plugin WordPress.

1. Créer un nouveau flux Facebook

Après avoir installé et activé le plugin, rendez-vous dans le menu Facebook Feed " All Feeds (Tous les flux) de votre tableau de bord WordPress. De là, cliquez sur le bouton Ajouter un nouveau pour commencer à créer votre flux d'événements.

Ajouter un nouveau flux facebook

Sur la page suivante, vous verrez 9 types de flux Facebook différents que vous pouvez ajouter à votre site web, y compris :

  • Chronologie
  • Photos
  • Vidéos
  • Albums
  • Evénements
  • Commentaires
  • Et plus encore

Choisissez l'option Événements et cliquez sur le bouton Suivant pour continuer.

Sélectionnez le type de flux de l'événement

2. Sélectionnez une source de page Facebook

Après avoir sélectionné un type de flux, il est temps de choisir une source de page Facebook. Il peut s'agir d'un groupe Facebook ou d'une page sur laquelle vous publiez les événements de votre entreprise.

Pour ajouter une source, cliquez sur le bouton Ajouter un nouveau.

Ajouter une nouvelle source pour votre flux d'événements

Une fenêtre contextuelle s'ouvre pour vous demander l'identifiant de votre page Facebook et le jeton d'accès à l'événement.

Si vous ne savez pas comment procéder, suivez ces instructions pour trouver l'identifiant de l'application et le jeton secret de l'application pour votre page.

Entrez l'identifiant de votre page Facebook et le jeton d'accès

Après avoir saisi les détails de votre application Facebook, cliquez sur le bouton Ajouter une source.

Sur l'écran suivant, vous verrez votre page Facebook nouvellement ajoutée. Sélectionnez cette page et cliquez sur Suivant pour continuer.

Sélectionnez la source des événements de votre page Facebook

3. Personnalisez la présentation de votre calendrier d'événements Facebook

Vous pouvez maintenant commencer à personnaliser vos événements. Les options de personnalisation se trouvent sur le côté gauche, tandis qu'un aperçu de votre flux se trouve sur la droite.

Les options de personnalisation vous permettent de modifier le type de flux, la mise en page, la couleur, le design de l'en-tête, le design de l'article, etc.

Tout d'abord, choisissez l'option Feed Layout sur la gauche.

Choisir une mise en page pour les événements Facebook

Cette option offre trois paramètres différents, dont les dispositions en liste, en maçonnerie et en carrousel.

Pour afficher les événements les uns après les autres, choisissez l'option de mise en page Liste.

Mise en page d'une liste pour un calendrier d'événements sur Facebook

Vous pouvez également sélectionner l'option Masonry si vous préférez afficher vos événements dans une disposition à plusieurs colonnes.

Mise en page de flux de maçonnerie pour les événements Facebook

Enfin, l'option Carousel vous permet de présenter vos événements sous la forme d'un superbe curseur d'images.

Mise en page carrousel pour les événements facebook

Sélectionnez la mise en page qui convient le mieux à votre site web. Cliquez ensuite à nouveau sur le bouton Personnaliser pour revenir aux paramètres précédents.

4. Personnalisez la palette de couleurs de votre fil d'événements Facebook

Si vous souhaitez modifier la couleur de votre flux, cliquez sur l'en-tête Color Scheme. Dans ce panneau, vous pouvez choisir parmi 4 options de couleurs différentes, telles que :

  • Hériter du thème : Copier la palette de couleurs de votre site web
  • Léger: Fond clair avec texte de couleur foncée
  • Sombre : rendre l'arrière-plan sombre avec un texte de couleur claire
  • Personnalisé : Saisissez vous-même toutes les couleurs
Sélectionnez une palette de couleurs pour votre flux d'événements Facebook

Vous pouvez ensuite personnaliser d'autres paramètres, notamment la conception de l'en-tête, la taille du flux, les marges, etc.

Lorsque vous êtes satisfait de l'aspect des choses, cliquez sur le bouton Enregistrer .

5. Afficher les événements de Facebook dans les pages WordPress

Vous êtes maintenant prêt à intégrer des événements Facebook sur votre site WordPress, et Smash Balloon vous permet de le faire de deux manières.

Tout d'abord, cliquez sur le bouton Embed (Intégrer) dans le coin supérieur droit. Une fenêtre contextuelle s'ouvre alors, proposant différentes options de publication.

Cliquez sur le bouton "Intégrer le flux d'événements Facebook".

Cliquez sur le bouton Ajouter à une page pour intégrer vos événements Facebook à une page WordPress normale.

Cliquez sur le bouton Ajouter à une page

À partir de là, vous pouvez choisir n'importe quelle page de votre site web dans la liste et cliquer sur le bouton Ajouter.

Choisissez une page pour votre calendrier d'événements

En cliquant sur cette option, vous accédez à l'écran d'édition de la page choisie. À partir de là, cliquez sur l'icône plus (+) et sélectionnez le widget Custom Facebook Feed.

Ajouter le bloc de flux Facebook personnalisé

Lorsque vous mettez à jour ou publiez la page, vous pouvez la prévisualiser pour voir à quoi ressemblent vos événements.

Prévisualisez votre calendrier d'événements facebook

6. Ajouter des événements Facebook aux barres latérales de WordPress

Si vous préférez ajouter votre flux à une zone de la barre latérale, il vous suffit de cliquer sur le bouton Ajouter à un widget dans la fenêtre Embed.

Ajoutez votre calendrier d'événements Facebook en tant que widget

En cliquant sur cette option, vous accédez à la page des widgets, où vous pouvez choisir une barre latérale pour afficher vos événements.

Après avoir choisi une barre latérale, cliquez sur l'icône plus (+) pour ajouter un nouveau widget et choisissez le widget Custom Facebook Feed.

Choisissez le widget personnalisé facebook feed pro

Une fois que vous avez fait cela, vous pouvez prévisualiser votre site web et voir vos événements Facebook dans la barre latérale de votre site web.

Intégrer des événements facebook dans la barre latérale de WordPress

Méthode 3 : Ajouter des événements Facebook à WordPress sans plugin

Si vous n'aimez pas utiliser trop de plugins WordPress sur votre site web, vous pouvez afficher les événements Facebook sur WordPress sans plugin.

Cependant, cette méthode nécessite d'ajouter du code à votre site, ce qui fait qu'elle n'est pas recommandée aux débutants. Elle n'offre pas non plus beaucoup de contrôle sur l'aspect de vos événements.

1. Visitez le site web de Facebook Page Plugin.

Pour commencer avec cette méthode, vous aurez besoin du plugin de page Facebook. Il ne s'agit pas d'un plugin WordPress, mais d'un outil autonome de Facebook destiné aux développeurs.

Rendez-vous donc sur l'outil Facebook Plugin et collez l'URL de votre page Facebook.

Visitez l'outil de plugin de page facebook

Après avoir saisi l'URL de votre page Facebook, l'outil affiche un aperçu de votre chronologie. Comme nous voulons afficher vos événements Facebook, supprimez le mot "timeline" dans le champ Onglets et entrez "events".

entrer dans le champ de l'onglet "événements

2. Générer le code d'intégration de votre événement Facebook

Le panneau de prévisualisation affiche désormais une liste des événements de votre page. Pour obtenir le code, cliquez sur le bouton Obtenir le code situé sous l'aperçu.

Cliquez sur le bouton Obtenir le code

En cliquant sur le bouton Obtenir le code, une fenêtre contextuelle s'ouvre avec deux onglets : JavaScript SDK et IFrame. Cliquez sur l'onglet IFrame, puis copiez le code d'intégration dans votre presse-papiers.

Copier le code d'intégration de l'IFrame des événements Facebook

3. Intégrer le code des événements Facebook dans WordPress

Ensuite, rendez-vous sur votre site WordPress et modifiez l'article ou la page où vous souhaitez afficher vos événements Facebook.

Dans l'écran d'édition de l'article ou de la page, cliquez sur l'icône plus (+) et trouvez le bloc Custom HTML WordPress.

Ajouter le bloc HTML personnalisé de WordPress

Maintenant, cliquez à l'intérieur du bloc HTML et collez le code d'intégration de l'outil Facebook Page Plugin.

Collez le code d'intégration des événements de la page Facebook

Vous pouvez ensuite enregistrer ou publier le message, et lorsque vous le prévisualisez, vos événements Facebook seront en ligne sur votre site web.

Exemple d'intégration d'événements Facebook sur WordPress sans plugin

Si vous souhaitez modifier l'affichage de ce flux, vous devrez revenir au plugin de page Facebook et générer à nouveau le code wp embed Facebook. Cela dit, les paramètres Facebook que vous pouvez modifier sont limités.

Utilisation de l'URL iCal pour la synchronisation des événements

Si vous souhaitez intégrer vos événements Facebook dans le calendrier de votre site web, l'utilisation d'une URL iCal est une méthode efficace.

Voici comment obtenir et utiliser l'URL iCal :

Connectez-vous à votre compte Facebook, accédez à votre section d'événements et sélectionnez l'événement que vous souhaitez partager.

En haut à droite, vous verrez un bouton intitulé Ajouter au calendrier.

Ajouter un événement facebook au calendrier

Cliquez sur ce bouton et, dans la fenêtre contextuelle, faites un clic droit sur le bouton Exporter et sélectionnez "Copier l'adresse du lien".

Copier l'adresse du lien événementiel de facebook

Ajoutez cette URL aux paramètres de votre calendrier WordPress ou à tout autre plugin de calendrier acceptant les flux iCal. Cela synchronisera automatiquement vos événements Facebook avec le calendrier de votre site web.

Foire aux questions sur l'intégration d'événements Facebook

Comment puis-je personnaliser l'apparence des événements Facebook dans WordPress ?

La personnalisation au-delà des options de ce guide peut nécessiter l'utilisation de CSS ou de JavaScript personnalisés. Les utilisateurs ayant des connaissances en codage peuvent modifier directement les styles ou les scripts de leur thème WordPress ou utiliser un thème enfant pour appliquer des styles plus personnalisés au flux d'événements Facebook.

Comment résoudre les problèmes lorsque les événements Facebook ne s'affichent pas ?

Si les événements Facebook ne s'affichent pas sur votre site WordPress, recherchez des problèmes courants tels que des plugins obsolètes, des conflits avec d'autres plugins ou une mauvaise configuration de l'API Facebook. S'assurer que tous les plugins sont à jour et consulter la documentation du plugin pour s'assurer de l'exactitude de la configuration permet souvent de résoudre ces problèmes.

L'intégration d'événements Facebook peut-elle affecter les performances de mon site ?

L'intégration d'événements Facebook peut avoir un impact sur les performances du site, notamment en augmentant le temps de chargement des pages. Pour minimiser cet impact, assurez-vous d'utiliser des plugins optimisés tels que SeedProd ou Smash Balloon, qui sont conçus pour charger efficacement le contenu externe. Utilisez également des plugins de mise en cache pour améliorer les performances globales du site.

Et voilà !

Avec l'aide de cet article, vous connaissez maintenant 3 façons différentes d'intégrer des événements Facebook sur WordPress.

Vous aimerez peut-être aussi cet article sur l'optimisation de votre page d'atterrissage pour améliorer les résultats de votre site web.

Merci de votre lecture ! Nous aimerions connaître votre avis, alors n'hésitez pas à laisser un commentaire pour nous faire part de vos questions et de vos réactions.

Vous pouvez également nous suivre sur YouTube, X (anciennement Twitter) et Facebook pour obtenir d'autres contenus utiles au développement de votre entreprise.

avatar de l'auteur
Stacey Corrin Rédacteur
Stacey écrit sur WordPress et le marketing numérique depuis plus de 10 ans et sur d'autres sujets depuis bien plus longtemps. Parallèlement, elle est fascinée par la conception de sites web, l'expérience utilisateur et le référencement.

Divulgation : Notre contenu est soutenu par les lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, il se peut que nous recevions une commission. Nous ne recommandons que des produits dont nous pensons qu'ils apporteront une valeur ajoutée à nos lecteurs.