Embedding : intégrer du contenu social à son site

Comment intégrer des contenus sociaux à son site web ? Facebook, Twitter, Google Plus, Instagram ou encore Youtube permettent d'insérer facilement des publications partagées depuis leur plateforme sur des pages web tierces (« embedding » en anglais). Une astuce simple pour dynamiser et enrichir la discussion autour d'un article sur son site. Comment procéder ?

Qu'est-ce que l'embedding ?

L'embedding consiste à intégrer dans les pages web de son site/blog différents contenus (texte, image, vidéo) partagés à partir d'une plateforme de publication.
Le contenu d'origine est ainsi reproduit sur une page de destination.
Parmi les plateformes ouvertes à l'intégration de contenus sociaux :

• Facebook,
• Twitter,
• YouTube et Dailymotion
• Instagram
• SlideShare, etc.

Intégrer du contenu social à son site : pour quoi faire ?

Intégrer sur son site du contenu publié à partir des réseaux sociaux présente plusieurs intérêts :

• Promouvoir ses propres publications sociales et favoriser les interactions autour d'elles : retweets, partages Facebook.
• Mettre en avant ses comptes sociaux et favoriser le recrutement direct de followers/abonnés,
• Enrichir la structure narrative d'un article en publiant des annonces officielles, des évènements, partagés sur des sites sociaux.
• Dynamiser un article, le rendre plus lisible
• Sourcer un article (citation)

À noter : les publications intégrées sont interactives, il est possible aux internautes de les partager, de les recommander sans se rendre sur la publication d'origine.

Comment intégrer du contenu social à son site ?

Dans tous les cas, l'intégration repose sur l'insertion d'un code à prélever à la source, c'est-à-dire directement depuis la publication puis à coller dans l'article de destination.

Facebook

Seules les publications publiques partagées sur une page Facebook peuvent être intégrées à un site tiers. Il est nécessaire d'être abonné à la page concernée pour récupérer son contenu.

Sur la liste déroulante disponible à partir d'une publication, sélectionner « intégrer la publication »



Récupérer le code dans la boîte de dialogue, l'insérer dans l'article de destination



À noter :

• Il n'est pas encore possible de redimensionner une publication Facebook intégrée
• Un post trop long apparaît tronqué, mais peut être déroulé par une action simple (ex : lire plus)

Une astuce simple pour trouver des publications pertinentes est d'utiliser le flux de hashtags de Facebook.

Ex : https://www.facebook.com/hashtag/(mot-clé)

Twitter

L'outil d'intégration est disponible au bas de chaque Tweet : il n'est pas nécessaire d'être connecté à son compte Twitter pour l'utiliser.

L'insertion est possible depuis un flux de tweets, ou depuis le permalien d'un tweet.
Première étape :


Deuxième étape :

• Il est possible d'afficher le fil de conversations lié au tweet (réponses),
• l'intégration est compatible avec tous les médias partagés : texte, photo (si partagée sur pic.twitter.com)

La fonction d'embedding de Twitter offre plusieurs paramètres d'affichage des tweets :

• Masquer la discussion liée au tweet. Pour cela, il faut ajouter l'attribut « data-conversation » au code à intégrer.

"<blockquote class="twitter-tweet" data-conversation="none">...</blockquote>"

• Masquer les "Twitter cards" (informations disponibles dans les tweets étendus), pour ne pas alourdir la présentation d'un article intégrant plusieurs tweets. Il faut pour cela utiliser l'attribut « data- cards ».

"<blockquote class="twitter-tweet" data-cards="hidden">...</blockquote>"

• Redimensionner un tweet (largeur, hauteur), paramétrer son alignement ou encore son graphisme.

Voir ici comment procéder

Google Plus

Les posts Google Plus exportés à partir du réseau social permettent aux internautes connectés à leur profil Google Plus :

• de les commenter,
• de les recommander (+1),
• de s'abonner directement à l'auteur du post.

Tous types de publications s'affichent :

• post (texte),
• image,
• gif animé,
• vidéo
• lien partagé.

Pour procéder à l'intégration :

• Passer la souris dans l'angle supérieur droit du post à intégrer pour faire apparaître une flèche vers le bas.
• Développer les options correspondantes sur la liste déroulante,
• Sélectionner "Intégrer le post"
• Copier/coller le code contenant du texte HTML/JS.

Il est nécessaire d'utiliser le permalien du post à intégrer.

Instagram

Comme pour les autres réseaux sociaux, la fonctionnalité d'embedding est disponible depuis chaque publication (photo/vidéo).
Il est possible de redimensionner (largeur/hauteur) la publication intégrée à son site.

Youtube

Pour intégrer une vidéo Youtube sur une page web, depuis le média concerné :

• Partager, puis intégrer,
• Youtube propose plusieurs tailles standard pour la vidéo à intégrer, il est également possible de personnaliser les dimensions manuellement.

Vimeo

L'intégration sur un site de contenus vidéos partagés sur la plateforme Vimeo fonctionne sur le même principe que Youtube.

• Depuis le lecteur vidéo, cliquer sur la fonction « share »,
• Cliquer sur la fonction « afficher les options » pour accéder à l'ensemble des paramètres d'embed,
• Copier et coller le lien iframe précisé dans la fenêtre de partage.

Les paramètres d'intégration autorisent une modification des dimensions, une lecture automatique ou en boucle de la vidéo, l'affichage du lien et de la description et une modification des couleurs.