Intégration de réseaux sociaux à des sites web publics dans SharePoint

S’APPLIQUE À : no-img-132013 yes-img-162016 yes-img-192019 no-img-seÉdition par abonnement no-img-sopSharePoint dans Microsoft 365

L'intégration de réseaux sociaux au sein de votre organisation peut vous aider à atteindre vos objectifs. L'intégration peut être réalisée sur l'intranet de votre organisation pour accroître la transparence, mais vous pouvez également intégrer les réseaux sociaux à votre site web public afin d'étendre sa portée et d'accroître sa conversion.

Intégration des réseaux sociaux

L'intégration avec les réseaux sociaux a été mise en avant au cours de ces dernières années. De nombreuses organisations souhaitent intégrer les réseaux sociaux à leur site web public, sans vraiment comprendre ce qu'implique une telle intégration et la façon dont elle pourrait appuyer les objectifs de l'organisation. Cet article n'a pas pour but de vous aider à vous faire une idée de l'utilisation des réseaux sociaux au sein de votre organisation. À la place, il présente plusieurs scénarios d'intégration différents et les avantages que vous pouvez en retirer. Finalement, vous devez faire un choix éclairé concernant la technique d'intégration qui fonctionnera pour votre scénario et l'apparence de l'intégration.

Du point de vue de la communication, vous pouvez intégrer les réseaux sociaux de deux manières :

  • Publier des informations à partir de votre site web sur les réseaux sociaux ; ce qui peut se révéler aussi facile que d'ajouter un bouton « J'aime » de Facebook. Cela vous permettra d'étendre la portée du contenu de votre site web au-delà de ses limites et d'atteindre les amis et collègues de vos visiteurs.

  • Tirez profit des informations relatives au visiteur actuel à partir de ses réseaux sociaux pour déterminer le contenu de votre site web qui serait le plus pertinent pour lui. En utilisant cette approche, vous pouvez amener vos visiteurs à découvrir du contenu de votre site web qui leur est inconnu. Une fois de plus, cela peut vous permettre d'étendre votre portée et d'accroître la conversion de votre site.

Cet article décrit la première option.

Notions de base de l’intégration de réseaux sociaux dans SharePoint 2013

L'objectif de l'intégration de réseaux sociaux est d'atteindre le plus grand nombre de personnes possible. Lorsque les informations relatives au contenu de votre site web (articles, billets de blogs ou produits) sont découvertes et jugées utiles, elles peuvent être partagées par vos visiteurs avec leurs amis qui, à leur tour, les partageront aussi peut-être avec leurs amis. Votre contenu atteindra des personnes qui n'auraient autrement pas entendu parler de votre site web, avant même que vous le sachiez. Mais pour que cela se produise, vous devez vous assurer que lorsque votre contenu est partagé sur des réseaux sociaux, il ressemble exactement à ce que vous voulez.

Tout comme il est possible d'optimiser votre contenu web pour les moteurs de recherche sur Internet, vous pouvez fournir des méta-informations sur votre contenu aux réseaux sociaux. Beaucoup de ces réseaux, tels que Facebook ou Yammer, utilisent le protocole Open Graph pour récupérer des informations sur votre contenu. Pour contrôler l'affichage de votre contenu lorsque celui-ci est partagé sur les réseaux sociaux, vous devez intégrer des métadonnées Open Graph à votre site web. Les métadonnées doivent décrire l'essence de votre contenu de sorte que toute personne voyant votre contenu sur un réseau social aura envie de cliquer dessus.

Intégration du protocole Open Graph à un site web public créé avec SharePoint 2013

La publication de métadonnées Open Graph pour un site web créé avec SharePoint Server 2016 n’est pas complexe. Toutefois, vous devez prendre en considération plusieurs éléments. Tout d'abord, Open Graph définit différents types de contenu web, ce qui est semblable à ce que vous pouvez faire avec les types de contenu dans SharePoint. Avant de débuter l'intégration du protocole Open Graph à votre site web, vous devez connaître les types de contenu figurant dans votre site et la description la plus appropriée et efficace à l'aide d'Open Graph.

En plus des divers types de contenu que vous pouvez publier sur votre site web, il existe également des différences dans la façon dont ce contenu est publié. SharePoint Server 2016 offre deux modèles de publication de contenu :

  • Le modèle de publication de contenu classique (que vous connaissez peut-être grâce à SharePoint 2007 et 2010) dans lequel l'emplacement physique des pages déterminait leur emplacement dans la hiérarchie et la navigation de votre site web.

  • Nouveau modèle de publication piloté par la recherche qui utilise SharePoint Server 2016 Search pour publier du contenu à partir d’une ou plusieurs sources

Ces modèles de publication ont deux façons de publier du contenu et, en fonction de celui que vous utilisez sur votre site, vous devez planifier la publication des informations selon votre modèle de publication de contenu.

Les informations Open Graph sont publiées à l'aide des balises META HTML. Ces balises doivent se trouver dans la section principale de votre site web. Afin de prendre en charge la publication de différentes informations Open Graph pour divers types de pages et de modèles de publication de contenu, vous devez définir un espace réservé de contenu dans votre page maître. Vous pourrez ainsi remplacer cet espace réservé par les métadonnées appropriées à partir des différentes mises en page. L'exemple de code suivant présente un espace réservé de contenu ajouté à la page maître standard seattle.master pour prendre en charge la publication des informations Open Graph :

<head>
…
<!--MS:<asp:ContentPlaceHolder
id="OpenGraphPlaceHolder" runat="server">-->
<!--ME:</asp:ContentPlaceHolder>-->
…
</head>

Selon le protocole Open Graph, quatre propriétés sont requises pour chaque page web : titre, type, image et URL. Bien qu’Open Graph définisse plusieurs types de contenu, si vous ne publiez pas d’informations sur la vidéo ou l’audio, il est fort certain que vous utiliserez le type d’article pour la plupart de vos pages web. Puisque toutes les pages ne sont pas des articles, vous devrez peut-être utiliser le type site web. Il s'agit du type par défaut lorsqu'aucun n'est spécifié. Pour simplifier l'utilisation d'Open Graph, nous pourrions étendre l'exemple de code ci-dessus en ajoutant les informations sur le titre, l'URL et le type. Ainsi, nous n'aurons pas à reproduire le même exemple de code dans chaque mise en page.

Bien que les informations open Graph de base font partie des informations SEO publiées par SharePoint Server 2016, les contrôles SEO standard SharePoint Server 2016 ne peuvent pas être utilisés directement pour afficher ces informations sur les pages maîtres et les mises en page en tant que balises meta Open Graph. Pour utiliser ces contrôles pour la publication de métadonnées Open Graph, nous avons créé un ensemble de contrôles de wrapper que nous avons ensuite publiés avec cet article afin d'expliquer la création de contrôles de wrapper similaires.

À l’aide des fonctionnalités d’optimisation du moteur de recherche de SharePoint Server 2016, nous pouvons récupérer les informations sur la page comme suit :

<head>
…
<!--SPM:<%@Register Tagprefix="Contoso"
Namespace="Contoso.SharePoint.Seo.Controls"
Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=a285ef6967f781d3"%>-->
<!--MS:<Contoso:TemplatedControlWrapper
runat="server">-->
<Control>
   <control
type="Microsoft.SharePoint.Publishing.WebControls.SeoBrowserTitle"
assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
</Control>
<ContentTemplate><meta
property="og:title" content="$Value$"/></ContentTemplate>
<!--ME:</Contoso:TemplatedControlWrapper>-->
<!--MS:<Contoso:HyperlinkControlWrapper
runat="server">-->
<Control>
   <control
type="Microsoft.SharePoint.Publishing.WebControls.SeoCanonicalLink"
assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
</Control>
<ContentTemplate><meta
property="og:url"
content="$Url$"/></ContentTemplate>
<!--ME:</Contoso:HyperlinkControlWrapper>-->
<meta property="og:type content="article"
/>
<!--MS:<asp:ContentPlaceHolder
id="OpenGraphPlaceHolder" runat="server">-->
<!--ME:</asp:ContentPlaceHolder>-->
…
</head>

Cette approche suppose que vous vouliez que le titre de votre page soit publié sur les réseaux sociaux exactement comme il est affiché dans la barre de titre d'un navigateur web. Si jamais votre scénario diffère, vous pouvez remplacer le contenu de la propriété du titre par une alternative adéquate, ou le supprimer, puis le remplir à partir de l'espace réservé de contenu OpenGraphPlaceHolder .

Le principal avantage de l’utilisation des contrôles d’optimisation du moteur de recherche SharePoint Server 2016 standard, comme illustré ci-dessus, est qu’ils fonctionnent pour les deux modèles classiques en plus du modèle de publication de contenu piloté par la recherche et qu’ils récupèrent automatiquement le contenu nécessaire à l’aide de l’approche nécessaire.

La prochaine étape consiste à fournir les informations spécifiques du type de page en fonction du protocole Open Graph. Pour les pages utilisant le modèle de publication classique, vous pouvez utiliser les contrôles de publication pour récupérer le contenu, par exemple :

<!--MS:<asp:ContentPlaceHolder
id="OpenGraphPlaceHolder" runat="server">-->
   <!--SPM:<%@Register
Tagprefix="Contoso"
Namespace="Contoso.SharePoint.Seo.Controls"
Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=a285ef6967f781d3"%>-->
   <!--MS:<Contoso:TemplatedControlWrapper
runat="server">-->
   <Control>
     <control
type="Microsoft.SharePoint.WebControls.FieldValue"
assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c" FieldName="PublishingContactProfileUrl"
/>
   </Control>
   <ContentTemplate><meta
property="article:author"
content="$Value$"/></ContentTemplate>
   <!--ME:</Contoso:TemplatedControlWrapper>-->
<!--ME:</asp:ContentPlaceHolder>-->

Lors de l'utilisation de la publication basée sur la recherche, vous devrez plutôt utiliser des composants WebPart Réutilisation d'élément de catalogue :

<!--MS:<asp:ContentPlaceHolder
id="OpenGraphPlaceHolder" runat="server">-->
   <!--SPM:<%@Register
Tagprefix="Contoso "
Namespace="Contoso.SharePoint.Seo.Controls"
Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=a285ef6967f781d3"%>-->
   <!--MS:<Contoso:TemplatedControlWrapper
runat="server">-->
   <Control>
     <control
type="Microsoft.Office.Server.Search.WebControls.CatalogItemReuseWebPart"
assembly="Microsoft.Office.Server.Search, Version=15.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c"
UseSharedDataProvider="True"
SelectedPropertiesJson="[&amp;quot;PublishingContactProfileUrlOWSTEXT&amp;quot;]"
/>
   </Control>
   <ContentTemplate><meta
property="article:author" content="$Value$"/></ContentTemplate>
   <!--ME:</Contoso:TemplatedControlWrapper>-->
<!--ME:</asp:ContentPlaceHolder>-->

Lors de l'utilisation de la publication intersites, dans la plupart des scénarios, le contenu des pages de détail (appelé page d'élément de catalogue) est exposé à partir de l'index de recherche et peut être récupéré tel qu'illustré ci-dessus. Le contenu des pages d'aperçu (appelées pages de catégorie) est déterminé par les informations issues du service de métadonnées gérées. Si vous devez récupérer des informations de votre taxonomie pour les afficher dans votre manifeste Open Graph, vous pouvez utiliser le contrôle TermProperty pour ce faire :

<!--MS:<asp:ContentPlaceHolder
id="OpenGraphPlaceHolder" runat="server">-->
   <!--SPM:<%@Register
Tagprefix="Contoso"
Namespace="Contoso.SharePoint.Seo.Controls"
Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral,
PublicKeyToken=a285ef6967f781d3"%>-->
   <!--SPM:<%@Register
TagPrefix="Taxonomy"
Namespace="Microsoft.SharePoint.Taxonomy"
Assembly="Microsoft.SharePoint.Taxonomy, Version=15.0.0.0,
Culture=neutral, PublicKeyToken=71e9bce111e9429c"%>-->
   <!--MS:<Contoso:TemplatedControlWrapper
runat="server">-->
   <Control>
     <control
type="Microsoft.SharePoint.Taxonomy.TermProperty" assembly=" Microsoft.SharePoint.Taxonomy,
Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"
PropertyName="Title" />
   </Control>
   <ContentTemplate><meta
property="article:section"
content="$Value$"/></ContentTemplate>
   <!--ME:</Contoso:TemplatedControlWrapper>-->
<!--ME:</asp:ContentPlaceHolder>-->

Les divers réseaux sociaux prennent en charge des métadonnées différentes. En fonction du réseau social que vous voulez intégrer à votre site web, vous devez vérifier l'API appropriée. En utilisant les techniques présentées ci-dessus, vous pouvez fournir des informations pertinentes sur vos pages web et vous assurer de la bonne présentation de votre contenu sur les réseaux sociaux.

Après avoir configuré les informations de base sur les pages web, explorons les différentes fonctionnalités d'intégration offertes par les réseaux sociaux. Par souci de concision, nous allons prendre Facebook pour exemple, mais les mécanismes présentés peuvent également s'appliquer à d'autres réseaux sociaux.

Vue d’ensemble des plug-ins sociaux de Facebook et de la façon dont ils contribuent à l’intégration du réseau social dans votre site SharePoint 2013

Facebook offre plusieurs plug-ins standard que vous pouvez utiliser pour l'intégrer à votre site web. La vue d'ensemble de tous les plug-ins disponibles est publiée ici : Plug-ins sociaux Facebook. Voici à présent une vue d'ensemble de quelques plug-ins et de la façon dont vous pouvez les intégrer à votre site web.

Avant de commencer : informations

Lors de l'intégration à Facebook, vous pouvez ajouter un ou plusieurs widgets à votre site web. Même si vos visiteurs pourront interagir avec votre site web à l'aide des plug-ins Facebook, cela ne vous donnera que très peu d'informations sur la façon dont vos visiteurs utilisent les fonctionnalités de réseaux sociaux fournies. Bonne nouvelle, si vous voulez en savoir plus sur l'utilisation des plug-ins sociaux Facebook sur votre site, vous pouvez utiliser la fonctionnalité d'informations offerte par Facebook. Après avoir enregistré votre site web en tant qu'application Facebook et inclus l'ID de l'application sur votre site, vous pourrez accéder aux informations d'analyse sur l'utilisation de Facebook sur votre site web à partir de tous les widgets.

Pour plus d'informations, voir Informations sur Facebook.

Bouton « J’aime »

Le bouton « J’aime » de Facebook est probablement le plug-in social le plus populaire de Facebook. En un seul clic, vos visiteurs peuvent faire savoir à leurs amis qu’ils aiment une page de votre site. Ainsi, votre page, ainsi que la totalité de votre site peuvent faire l’objet d’une attention supplémentaire.

Si vous envisagez d'inclure le bouton « J'aime » sur chaque page de votre site web, il peut s'avérer plus efficace de l'inclure sur les pages de détail qui comportent le contenu important recherché par vos visiteurs. L'intégration du bouton « J'aime » de Facebook à votre site web est facile et consiste à ajouter deux extraits de code HTML à vos sites web.

Toute d'abord, l'appel SDK de Facebook doit être inclus une fois par page directement à la suite de la balise body :

<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/en_US/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Si vous avez enregistré votre site web en tant qu'application Facebook, vous devez inclure votre ID d'application (souligné) dans cet extrait de code :

<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/en_US/all.js#xfbml=1&amp;appId=0123456789";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Étant donné que cet extrait de code HTML est partagé entre toutes les pages de votre site web, vous pouvez l'inclure dans votre site web SharePoint en l'intégrant à votre page maître, comme le montre la figure suivante.

Code de la figure 1

Le deuxième exemple de code à inclure est le bouton « J'aime » lui-même :

<div class="fb-like" data-href="http://www.contoso.com" data-send="true" data-width="450" data-show-faces="true"></div>

Dans la mesure où la position du bouton « J'aime » peut varier d'une page à une autre, la meilleure façon de l'intégrer à votre site web est de l'inclure dans la mise en page.

Selon les instructions du bouton « J'aime », ce dernier doit contenir l'URL absolue de la page à laquelle il est intégré. Dans l'exemple de code mentionné auparavant, l'URL absolue se trouve dans l'attribut data-href . Étant donné que nous voulons placer le code dans la mise en page, nous ne voulons pas inclure une URL fixe. À la place, nous voulons insérer l'URL de la page actuelle affichée à l'aide de la mise en page. Comme SharePoint Server 2016 offre une prise en charge des URL physiques et conviviales, la meilleure façon d’obtenir l’URL de la page actuelle consiste à utiliser le contrôle d’URL canonique SharePoint Server 2016. En l'associant à l'exemple de code HTML du bouton « J'aime », nous obtiendrions le code suivant :

<!--SPM:<%@Register Tagprefix="Contoso" Namespace="Contoso.SharePoint.Seo.Controls" Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral, PublicKeyToken=a285ef6967f781d3"%>-->
<!--MS:<Contoso:HyperlinkControlWrapper runat="server">-->
<Control>
 <control type="Microsoft.SharePoint.Publishing.WebControls.SeoCanonicalLink" assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
</Control>
<ContentTemplate>
 <div class="fb-like" data-href="$Url$" data-send="true" data-width="450" data-show-faces="true"></div>
</ContentTemplate>
<!--ME:</Contoso:HyperlinkControlWrapper>-->

Construction d'un plug-in du bouton J'aime

Lors de la création du plug-in social du bouton « J'aime », il est intéressant d'envisager d'inclure l'option Envoyer.

Bien que conçue d'après une idée très simple, l'intégration du bouton « J'aime » à votre site web peut vous aider à étendre la portée de votre contenu. L’utilisation du bouton « J’aime » sur votre site web offre un avantage supplémentaire : combiné aux fonctionnalités d’analyse de la recherche SharePoint Server 2016, vous pouvez utiliser l’événement où quelqu’un aime une page web sur votre site web. En utilisant ces informations, vous pouvez par exemple présenter un contenu qui a été aimé à un endroit de choix sur votre site, augmentant à nouveau vos chances de conversion.

Bouton Envoyer

Lors de la création du plug-in social du bouton « J'aime », l'ajout de l'option Envoyer constitue une option intéressante. Si le fait de cliquer sur l'option « J'aime » donne la possibilité à vos visiteurs de partager votre page web avec tout le monde, ils peuvent utiliser le bouton Envoyer pour choisir les personnes avec lesquelles ils souhaitent partager votre page. Cela leur offre davantage de flexibilité et réduit, en outre, la barre de partage du contenu de votre site web.

Bouton Envoyer

Commentaires

La publication de contenu original est un excellent moyen de gagner en popularité et d'améliorer le classement de votre site sur les moteurs de recherche. En outre, donner la possibilité à vos visiteurs de vous faire part de leurs commentaires peut vous aider à améliorer votre site de façon à le rendre plus convivial et mieux adapté aux intérêts de votre public. Facebook propose le plug-in Commentaires que vous pouvez intégrer à votre site web pour permettre à vos visiteurs de le commenter.

Zone de commentaires

Donner à vos visiteurs la possibilité d'utiliser Facebook pour commenter votre contenu peut être d'une grande utilité pour vous, ainsi que pour vos visiteurs. Même si l'âge de votre public entre en ligne de compte, un grand nombre de personnes disposent d'un compte Facebook aujourd'hui. Il est plus facile pour eux d'utiliser leur profil Facebook existant pour laisser un commentaire sur votre site plutôt que de suivre un autre processus d'inscription.

Un autre avantage de l'utilisation de Facebook pour les commentaires réside dans le fait que lorsqu'une personne commente votre contenu, ce commentaire sera partagé avec ses amis. Théoriquement, cela vous permet d'étendre davantage votre portée. Cependant, gardez à l'esprit que si le commentaire n'est pas flatteur, tout le monde le verra.

Le processus d'intégration du plug-in Commentaires de Facebook est semblable à celui du bouton « J'aime » de Facebook. Dans la plupart des scénarios, vous souhaitez que ce plug-in apparaisse sous le contenu de chaque page. Pour ce faire, vous pouvez l'inclure dans le contenu de chaque mise en page utilisée sur votre site web.

De même que pour le bouton « J'aime » de Facebook, le plug-in Commentaires se compose de deux exemples de code. Le premier d'entre eux est identique à celui du bouton « J'aime » de Facebook. Ainsi, si vous prévoyez d'intégrer les deux plug-ins, vous ne devez l'inclure qu'une seule fois.

Le second extrait de code est le plug-in Commentaires lui-même. Il doit être placé à l'endroit où vous souhaitez qu'il s'affiche dans votre mise en page :

<div class="fb-comments" data-href="http://www.contoso.com" data-width="470" data-num-posts="10"></div>

De même que pour le bouton « J'aime » de Facebook, l'attribut data-href doit contenir l'URL absolue de la page qui pourra être commentée. Comme il est très probable qu’il s’agit de la page actuelle, vous pouvez de nouveau bénéficier du contrôle SeoCanonicalLink pour récupérer l’URL de la page actuelle :

<!--SPM:<%@Register Tagprefix="Contoso" Namespace="Contoso.SharePoint.Seo.Controls" Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral, PublicKeyToken=a285ef6967f781d3"%>-->
<!--MS:<Contoso:HyperlinkControlWrapper runat="server">-->
<Control>
 <control type="Microsoft.SharePoint.Publishing.WebControls.SeoCanonicalLink" assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
</Control>
<ContentTemplate>
 <div class="fb-comments" data-href="$Url$" data-width="470" data-num-posts="10"></div>
</ContentTemplate>
<!--ME:</Contoso:HyperlinkControlWrapper>-->

Flux d’activités

Un autre plug-in intéressant proposé par Facebook pour l’intégration de ses fonctionnalités aux sites web publics est le plug-in Flux d’activités.

Le plug-in Flux d'activités indique l'activité récente sur votre site web. Chaque fois que quelqu'un aime une page de votre site, le plug-in Flux d'activités est utilisé pour afficher le bouton « J'aime » dans le flux d'activités. D'autres actions personnalisées peuvent également être enregistrées, conservées et présentées dans le flux d'activités.

Le plug-in Flux d'activités peut aider vos visiteurs à découvrir du nouveau contenu, ce qui vous contribuera à étendre la portée de votre site web. Lorsque vos visiteurs sont connectés à Facebook, le flux d'activités affichera les activités des amis de vos visiteurs. La plupart du temps, il s'agit de personnes que vos visiteurs connaissent et en qui ils ont confiance. Par conséquent, ils suivront très probablement leurs recommandations et découvriront le contenu de votre site web. Par contre, s'ils ne sont pas connectés, le plug-in Flux d'activités affichera des recommandations de votre site et leur suggèrera évidemment de se connecter à Facebook pour voir du contenu plus pertinent.

Comme pour les autres plug-ins Facebook, le plug-in Flux d'activités est composé de deux exemples de code HTML nécessaires à l'intégration au site. Le premier est l'extrait de code SDK JavaScript Facebook que nous avons vu précédemment. Le second est le flux d'activités lui-même :

<div class="fb-activity" data-site="contoso.com" data-width="300" data-height="300" data-header="true" data-recommendations="false"></div>

La configuration du flux d'activités est simple. En utilisant l'attribut data-site, vous devez spécifier le nom de domaine de votre site web et les informations d'activité qui doivent être affichées. En utilisant d'autres attributs de données, vous pouvez contrôler l'expérience utilisateur du flux d'activités sur votre site web et indiquer si vous voulez explicitement inclure des recommandations.

Bien que vous puissiez placer le flux d'activités sur chaque page de votre site web, il est possible que cela vous porte préjudice et distraie vos visiteurs de votre contenu. Étant donné que le flux d'activités vous permet d'étendre la portée de votre site web, il est peut-être préférable d'examiner vos données d'analyse web et de le positionner à un emplacement un peu plus stratégique, par exemple sur les pages fréquentes de sortie et d'arrivée, telles que la page d'accueil.

Si l'on considère que, dans la plupart des scénarios, vous intégrerez le flux d'activités à des pages spécifiques, la meilleure façon de l'intégrer à votre site web n'est pas de l'inclure à la page maître ou aux mises en page, mais de l'ajouter à des pages spécifiques. La meilleure méthode consiste à intégrer l'exemple de code du flux d'activités dans la page à l'aide du composant WebPart Éditeur de script.

Code incorporé

Barre Recommandations

La barre Recommandations est un plug-in légèrement différent et néanmoins très intéressant. Ce plug-in peut également favoriser l'extension de la portée de votre site web en affichant du contenu recommandé. La différence de cette barre réside dans son scénario d'utilisation.

La barre Recommandations se situe au bas de la fenêtre du navigateur. Selon sa configuration, elle peut être visible après un certain temps, par exemple après que les utilisateurs ont passé un certain point de la page. Ce plug-in peut être très utile, car il fournit à vos visiteurs des suggestions de contenu supplémentaire qui pourrait les intéresser.

Lors de l'intégration de la barre Recommandations à votre site web, vous devez envisager son intégration aux pages de détail. De cette façon, lorsque vos visiteurs ont fini d'utiliser le contenu actuel, une étape suivante leur est proposée. Encore une fois, ce plug-in nécessite la référence au SDK JavaScript Facebook pour fonctionner. Le plug-in lui-même est représenté par le balisage suivant :

<div class="fb-recommendations-bar" data-href="http://contoso.com/articles/my-article/"></div>

Étant donné que vous souhaitez que les recommandations soient visibles sur chaque page, vous devez les ajouter aux mises en page utilisées par vos pages de détail. Le texte suivant correspond au balisage à ajouter à vos mises en page pour vous assurer que la barre Recommandations va fonctionner pour chaque page. Vous pouvez remarquer que le contenu de l'attribut data-href est défini de façon dynamique en utilisant le contrôle SeoCanonicalLink évoqué précédemment :

<!--SPM:<%@Register Tagprefix="Contoso" Namespace="Contoso.SharePoint.Seo.Controls" Assembly="Contoso.SharePoint.Seo, Version=1.0.0.0, Culture=neutral, PublicKeyToken=a285ef6967f781d3"%>-->
<!--MS:<Contoso:HyperlinkControlWrapper runat="server">-->
<Control>
 <control type="Microsoft.SharePoint.Publishing.WebControls.SeoCanonicalLink" assembly="Microsoft.SharePoint.Publishing, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" />
</Control>
<ContentTemplate>
 <div class="fb-recommendations-bar" data-href="$Url$"></div>
</ContentTemplate>
<!--ME:</Contoso:HyperlinkControlWrapper>-->

À l'instar de tout autre contenu, les recommandations affichées par la barre Recommandations sont contrôlées par l'activité sur votre site web et enregistrées par Facebook. Bien que la barre Recommandations affiche des suggestions de contenu personnalisées, elle ne vous permet pas de contrôler l'emplacement où ce contenu sera affiché. Même si les différences relatives aux éléments suggérés en tant que recommandations peuvent être subtiles, ce sont elles qui peuvent inciter les visiteurs à rester, ou non, sur votre site web.

Une alternative à l’intégration de la barre d’Recommandations Facebook qui est intéressante consiste à utiliser la fonctionnalité de recommandations de contenu fournie avec SharePoint Server 2016. Bien que certaines personnalisations soient nécessaires pour parvenir à une expérience utilisateur semblable à celle proposée par la barre Recommandations de Facebook, cette fonctionnalité offre la possibilité de contrôler le contenu affiché en tant que recommandation. Étant donné que les recommandations de contenu sont basées sur SharePoint Server 2016 Search, vous pouvez utiliser toutes ses fonctionnalités pour vous assurer que les recommandations les plus pertinentes sont affichées pour vos visiteurs.

Bonus : Yamming it !

Si votre organisation propose des produits ou des services aux consommateurs, l'intégration à Facebook peut être un choix judicieux. Si votre entreprise est plus basée sur la connaissance et qu'elle s'adresse à d'autres entreprises, il peut être utile d'intégrer Yammer également. Pour résumer : Yammer est le Facebook des entreprises. Il permet aux organisations de partager leurs connaissances en leur donnant la possibilité de communiquer dans les limites de leur organisation. Faciliter le partage du contenu de votre site web avec les réseaux Yammer des organisations peut vous permettre d'atteindre davantage d'entreprises.

Même si Yammer ne propose pas autant de plug-ins que Facebook, vous pouvez facilement inclure dans votre site web le bouton Yam it (« Partager sur Yammer »). Celui-ci offre à vos visiteurs la possibilité de partager la page en cours de visualisation avec leur réseau Yammer en un clic. Voici un exemple de code d’un bouton Yam it :

<a href="javascript:var d=document,w=window,e=w.getSelection,k=d.getSelection,x=d.selection,s=(e?e():(k)?k():(x?x.createRange().text:0)),f= 'https://www.yammer.com/home/bookmarklet',l=d.location,e=encodeURIComponent,p='?bookmarklet_pop=1&amp;amp;v=1&amp;amp;u='+e(l.href)%20+'&amp;amp;t='+e(d.title.replace(/^ *| *$/g,''))%20+'&amp;amp;s='+e(s),u=f+p;a=function()%20{if%20(!window.open(u,'sharer','toolbar=0,status=0,resizeable=1,width=650,height=550'))l.href=f+p};if%20(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else{a()}void(0);">Yam it!</a>

Le bouton Yam it est intégralement fondé sur le langage JavaScript, ainsi vous pouvez inclure l'extrait de code précédent directement dans SharePoint sans le modifier. Du point de vue de l’intégration, le bouton Yam it peut être mieux comparé au bouton « J’aime » de Facebook. Ainsi, partout où vous pensez qu’il est bon d’inclure le bouton « J’aime » de Facebook, il est probablement idéal d’inclure le bouton Yam it également.

Bouton Dites-le sur Yammer

Résumé

L’intégration des réseaux sociaux à votre site web peut vous aider à étendre la portée de votre site et aider vos visiteurs à découvrir du contenu nouveau. La plupart des réseaux sociaux proposent des plug-ins standard qui peuvent être facilement intégrés à votre système de gestion de contenu, ce qui est également le cas de SharePoint. Que vous souhaitiez intégrer des réseaux sociaux uniquement sur certaines pages spécifiques ou sur toutes les pages d’un type particulier, SharePoint vous offre la possibilité de le faire en toute simplicité.