Réseaux sociauxManuel d'intégration


  1. Installation
  2. Aides à l'intégration graphique
    1. "Helpers" Facebook
      1. Bouton "J'aime"
      2. Bouton "Partager"
    2. "Helper" Google+
    3. "Helper" ShareThis
    4. "Helper" envoyer par mail

Installation

  • Arrêter le serveur
  • Télécharger les jars du plugin et ajouter-les (ametys-plugin-socialnetworking-1.x.x.jar et ametys-plugin-socialnetworking-resources-1.x.x.jar) dans le répertoire WEB-INF/lib de votre application Ametys
  • Redémarrer le serveur

Aides à l'intégration graphique

Ce plugin fournit des aides ("helper") sous forme de template XSL pour la création de chartes graphiques, liés à des réseaux sociaux: Twitter, Facebook, ShareThis, Google+ ou envoi de mail

"Helpers" Facebook

Bouton "J'aime"

Cet "helper" vous permet d'ajouter le bouton "J'aime" ("Like") de Facebook sur vos pages. Ce bouton permet aux internautes de partager du contenu avec ses amis sur Facebook.

Trois gabarit de boutons sont proposés:

NomRendu

standard

button_count

box_count

Pour insérer le bouton "J'aime", importez la feuille de style xslt dans votre template XSL

 

<xsl:import href="plugin:socialnetworking://stylesheets/helpers/facebook.xsl" />

Puis utilisez le template nommé FB_like

 

<xsl:call-template name="FB_like">
    <xsl:with-param name="absoluteUrl"><xsl:value-of select="concat($absolute-site-uri-prefix, '/', $lang, '/', $page-path, '.html')"/></xsl:with-param>
    <xsl:with-param name="rendering-context"><xsl:value-of select="$rendering-context"/></xsl:with-param>
    <xsl:with-param name="layout">standard</xsl:with-param>
</xsl:call-template>

 

Le template accepte les paramètres suivant:

ParamètreDescription

absoluteUrl

L'url absolue de la page

layout

Gabarit du bouton parmi: 'standard', 'button_count' ou 'box_count'.
Par défaut, le gabarit "standard" est utilisé

action

'like' ou 'recommend. Verbe à afficher: Like/J'aime ou Recommend/Je recommande
Par défaut, l'action "like" est utilisée.

showFaces

true pour afficher la miniature du profil sous le bouton.
true par défaut.

width

La largeur en pixels.
450px par défaut.

height

La hauteur en pixels.
80px par défaut.

colorsheme

Couleur du thème : 'light' or 'dark'.
Par défaut "ligth" est utilisé

Bouton "Partager"

Cet "helper" vous permet d'ajouter le bouton "Partager" ("Share") de Facebook sur vos pages. Ce bouton permet aux internautes de partager du contenu avec ses amis sur Facebook.

Trois gabarit de boutons sont proposés:

NomRendu

button

button with counter

icon

box

Pour insérer  le bouton "Partager", importez la feuille de style xslt dans votre template XSL

<xsl:import href="plugin:socialnetworking://stylesheets/helpers/facebook.xsl" />

Puis utilisez le template nommé FB_share

<xsl:call-template name="FB_share">
    <xsl:with-param name="text"><i18n:text i18n:key="SKIN_FACEBOOK_SHARE_TEXT"/></xsl:with-param>
    <xsl:with-param name="layout">box</xsl:with-param>
    <xsl:with-param name="rendering-context"><xsl:value-of select="$rendering-context"/></xsl:with-param>
</xsl:call-template>

Le template accepte les paramètres suivant:

ParamètreDescription

text

Le texte du bouton. Par défaut "Share"

layout

Gabarit du bouton parmi: 'button', 'icon' or 'box'.
Par défaut, le gabarit "button" est utilisé

counter

true pour afficher un compteur.
false par défaut.

"Helper" Google+

Cet "helper" vous permet d'ajouter le bouton "Google+" sur vos pages. Ce bouton permet aux internautes de partager du contenu avec sur Google+.

4 tailles sont disponibles: small,medium, standard ou tall

NomRendu
small
medium
standard
tall

Pour chaque taille (excepté "tall") il est possible d'afficher ou non le compteur.

Pour insérer le bouton Google+, importez la feuille de style xslt dans votre template XSL

<xsl:import href="plugin:socialnetworking://stylesheets/helpers/google.xsl" />

Puis utilisez à l'endroit souhaité le template:

<xsl:call-template name="GOOGLE_plus_one">
    <xsl:with-param name="counter">true</xsl:with-param>
</xsl:call-template>

Le template accepte les paramètres suivant:

ParamètreDescription

size

Taille du bouton: small, medium, standard ou tall.
Par défauut "standard" est utilisé

counter

true / false pour afficher ou non le compteur.
Si la taille "small" est utilisée, le compteur sera toujours affiché

lang

Langue du compteur.
Par défaut il s'agit de la langue de la page courante

urlUrl à partager.
Par défaut il s'agit de l'url courante

 

"Helper" ShareThis

Ce "helper" vous permet d'ajouter le gadget "ShareThis" sur vos pages. Ce gadget permet aux internautes de partager le contenu sur le réseau social de leur choix (Twitter, Facebook, Google+, LinkedIn, Pinterest) ou par email.

5 gabarits sont proposés:

GabaritRendu
classic
multi-channel
multi-channel-large

vertical-counter

 

horizontal-counter

Pour insérer le widget ShareThis, importez la feuille de style XSLT dans votre template XSL

 <xsl:import href="plugin:socialnetworking://stylesheets/helpers/sharethis.xsl" />

Puis utilisez à l'endroit où vous souhaitez le template:

<xsl:call-template name="ShareThis">
     <xsl:with-param name="layout">multi-channel</xsl:with-param>
</xsl:call-template>

Par défaut, 7 partages sont actifs: Twitter, Facebook, LinkedIn, Google Plus, Pinterest, Mail et ShareThis. Chacun de ces liens peut-être désactivé au travers un paramètre du template XSL ShareThis. Dans l'exemple ci-après, les liens Google+, Pinterest et le partage par mail est désactivé:

<xsl:call-template name="ShareThis">
     <xsl:with-param name="layout">multi-channel</xsl:with-param>
     <xsl:with-param name="feature-gooleplus">false</xsl:with-param>
     <xsl:with-param name="feature-pinterest">false</xsl:with-param>
     <xsl:with-param name="feature-mail">false</xsl:with-param>
</xsl:call-template>

"Helper" envoyer par mail

Ce "helper" permet d'ajouter un lien "envoyer par mail" sur vos pages. Le lien ouvre une popup permettant à l'internaute d'envoyer le lien vers la page courante par mail aux destinataires de son choix.

A noter que cette fonctionnalité n'utilise pas la fonctionnalité mail de ShareThis, les mails sont envoyés par le CMS Ametys.

Pour insérer le lien "envoyer par mail", importez la feuille de style XSLT dans votre template XSL:

 <xsl:import href="plugin:socialnetworking://stylesheets/helpers/sendByMail.xsl" />

Puis utilisez à l'endroit souhaité le template "sendByMailForm":

<xsl:call-template name="sendByMailForm">
      <xsl:with-param name="link-content"><img src="{ametys:skinURL('img/mailto.png')}"/><i18n:text i18n:key="PLUGINS_SOCIAL_NETWORKING_SEND_MAIL_INFO" i18n:catalogue="plugin.socialnetworking"/></xsl:with-param>
</xsl:call-template>

Le paramètre link-content est le contenu HTML du lien. Par défaut il contient simplement le texte "Envoyer par mail", vous pouvez le surcharger pour modifier le texte, ajouter une image, etc ...


Retour en haut

Social networking