Facebook permet de Partager une citation d'un article en un seul clic

Facebook propose une nouvelle fonctionnalité qui devrait aider les éditeurs de contenus et les développeurs d’applications à faire partager facilement une citation extraite de leur contenu.

Facebook permet de Partager une citation d'un article en un seul clic

Il arrive souvent qu’on partage un article, notamment via le mobile, sans avoir envie de saisir du texte ou même de copier un extrait du texte et d’aller le coller dans le champ de partage Facebook.

Avec la fonctionnalité “Partager la citation”, les utilisateurs de Facebook pourront, depuis n’importe quel contenu sur le web ou le mobile, utiliser facilement un extrait comme commentaire du lien partagé.

Pour ce faire, ils n’auront qu’à surligner (sélectionner) un court extrait qui fait sens pour voir s’afficher le bouton ci-dessous avec la mention “Partager la citation”.


Il suffira alors de cliquer sur ce bouton interactif pour partager le lien du contenu avec cet extrait de contenu sélectionné directement sur votre compte Facebook.

Bien entendu, vous pouvez, en plus de cet extrait de texte utilisé comme citation, ajouter votre propre commentaire avant partage sur Facebook.


Dans le fil d’actualités, le post s’affichera en tant que citation avec un lien pointant vers l’URL originale ou la source.

Comment ajouter le plugin “Partager la citation”


Avec le plugin Partager la citation, vous pouvez autoriser les personnes à surligner du texte pour le faire apparaître comme citation avec un lien partagé. Vous pouvez également prédéfinir une citation, par exemple une citation isolée dans un article, afin qu’elle apparaisse avec le lien partagé.

Dans ces deux cas, la citation apparaît dans un champ qui lui est propre, séparé des commentaires de l’utilisateur.

Vous aurez besoin d’ajouter 3 bouts de codes dans votre code source pour permettre à vos utilisateurs de sélectionner un extrait à partager avec le lien.

1. Dans le Head : Placez le code ci-dessous, après l’avoir personnalisé avec vos propres données ou variables, dans la partie comprise entre <HEAD> et </HEAD> de votre code source :

<html>

<head>
<title>...</title>
<!-- Comment #1: OG Tags -->

<meta property="og:url" content="URL du contenu" />
<meta property="og:type" content="Article" />
<meta property="og:title" content="Titre de votre article" />
<meta property="og:description" content="Description Article" />
<meta property="og:image" content="URL image du contenu" />
</head>

2. Dans le Body : Juste en dessous du Body, placez le code suivant sans rien changer.

<body>
<!-- Comment #2: SDK -->
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.6";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

3. Avant Fermeture du Body : Juste au-dessus de la balise de fermeture </BODY>, vous placez le code ci-dessous :

<!-- Comment #4: Plugin Code -->
<div class="fb-quote"></div>

</body>
</html>