Social tags

Le plugin Social Tags permet d’ajouter des icônes de partage de liens vers les sites tels que Digg, Facebook, Delicious....

Une fois le plugin installé et activé (voir doc.), le choix des sites se fait via un menu de configuration.

Insertion dans les pages

Le plugin utilise la balise #INSERT_HEAD de vos squelettes.
Il suffit de configurer le plugin via cfg en indiquant le nom de votre div, et d’insérer éventuellement le code suivant dans les squelettes :

<div id="socialtags"></div>

La noisette ou le div va donc afficher une série d’icônes relatives aux sites choisis, une petite image vaut mieux qu’un long discours :

Le plugin offre une très grande liste de réseaux sociaux et de bookmarking, notamment :
Digg, Delicious, Facebook, Google Bookmarks, Technorati, Live, Scoopeo, Wikio, Furl, Blogmarks, Reddit, Mister wong, Viadéo, MySpace...

Le plugin est téléchargeable sur la zone :
socialtags.zip.

Vous êtes invité à ajouter des sites de réseaux sociaux si vous le désirez, c’est sur la zone.

Réserver les boutons aux visiteurs en provenance du site concerné

Cette nouvelle option (version 0.8 du plugin) permet de réserver l’affichage du bouton « partager » aux seuls utilisateurs en provenance de Facebook. Ceci afin de ne pas gêner les visiteurs qui ne souhaitent pas utiliser Facebook.

L’option fonctionne en ajoutant un cookie social_facebook=1 à tout visiteur provenant de Facebook. Dès lors, l’affichage du bouton « partager » sera conditionné à la présence de ce cookie.

Pour tester cette fonctionnalité, on peut passer le referer dans l’URL : http://zzz.rezo.net/?HTTP_REFERER=h... ; pour revenir à l’état précédent, il suffit de supprimer son cookie social_facebook.

Ajouter un badge Facebook

Le bloc de badge javascript permet d’afficher un badge Facebook ou autre. Il est programmé de manière à pouvoir être réservé aux visiteurs en provenance de Facebook. Voici, à titre d’exemple, comment je procède pour mettre le badge du site per.sonn.es sur le site zzz.rezo.net.

La page http://www.facebook.com/facebook-wi... m’indique que je peux utiliser comme badge le code HTML suivant :

<script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/fr_FR"></script>
<script type="text/javascript">
	FB.init("f38e69d43f79cbe7e03bba1d54c0a01c");
</script>
<fb:fan profile_id="213643810738" stream="1" connections="10" width="300"></fb:fan>
<div style="font-size:8px; padding-left:10px">
	<a href="http://www.facebook.com/pages/personnes/213643810738">per.sonn.es sur Facebook</a>
</div>

On remarque que ce badge :
-  appelle la librarie JS de Facebook http://static.ak.connect.facebook.c...
-  définit une largeur de 300 pixels (width="300")
-  affichera le flux de nouvelles de la page (stream="1")
-  affichera 10 photos de fans (connections="10")
-  conduira vers la page profile_id="213643810738"
-  est marqué d’une clé d’API "f38e69d43f79cbe7e03bba1d54c0a01c"
-  pose un lien « en dur » vers la page (ce qui permet au passage à Facebook d’augmenter son pagerank).

Pour obtenir l’équivalent en javascript on écrira dans la boîte JS :

if (document.cookie.match('social_facebook=1'))
$.getScript('http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/fr_FR', function() {
  $('.menu.subscribe')
  .append('<fb:fan profile_id="213643810738" stream="1" connections="8" width="250"><\/fb:fan>');
  FB.init('f38e69d43f79cbe7e03bba1d54c0a01c');
});

À la 1re ligne, je vérifie si le visiteur a un cookie indiquant qu’il est dejà venu sur ce site depuis Facebook ; le cas échéant, on va lui envoyer le badge.

La deuxième ligne charge la librairie facebook, puis, une fois celle-ci chargée, insère le marqueur de badge, avec toute sa configuration, dans le bloc .menu.subscribe, et enfin exécute le script avec la clé d’API.

On remarque au passage que je n’ai pas conservé le « lien en dur », inutile et pas très esthétique.

 

À noter : une fois le code HTML d’un badge renseigné dans le CFG du plugin, il est possible de l’insérer dans les squelettes avec #MODELE{socialtags_badge}, ou dans un article avec le raccourci <socialtags|badge>.

Ajouter Google+1

Si vous avez le plugin google+1 activé, vous pouvez choisir de l’afficher à la suite de vos images de tags.
Pensez à configurer le plugin google+1 pour adapter la taille du bouton.

Noisettes

Le plugin fournit des noisettes paramétrables utilisables dans le noiZetier et permettant d’afficher les badges et boites de type « J’aime » de Facebook.

Discussion

240 discussions

  • 1

    Je me répond à moi même !

    C(est bien cfg le coupable, il n’avait pas enregistré la liste des services... donc rien ne s’affichait ! Grrr !

    Désolé pour le bruit.

    Et merci pour ce plugin.

    • Bonjour, je teste en ce moment sur plusieurs sites, j’ai bien lu toutes les manipulations que certains ont fait mettant en cause CFG, mais rien ne fonctionne.

      Je ne sais vraiment plus quoi faire avec ce plugin qui ne me posait aucun problème sous SPIP 1.9.X

      Si vous avez une idée ...

      Merci d’avance.

      Doc Mac

    Répondre à ce message

  • L’information n’a pas l’air de se trouver dans le fichier zippé : sous quelle licence est distribué ce plugin ?

    Répondre à ce message

  • 3

    Bonjour et (milles) bravos pour ce plug in.
    Sauf erreur de ma part, il ne permet cependant pas de « tagger » les brèves ou les rubriques, mais seulement les articles. Pensez vous que cela puisse être possible ?

    Merci encore !

    • Ca devrait maintenant fonctionner pour le breves et les rubriques... pour ajouter du nouveaux « social site », il faut repeter l’operation 3 fois.

    • Bonsoir Phil,

      J’avais déjà fait (pour les breves et rubriques) :

      [(#INCLUREfond=noisettes/socialtagsid_breve)] pour les breves
      [(#INCLUREfond=noisettes/socialtagsid_rubrique)] pour les rubriques

      Mais ça ne donne rien.
      Faut il recharger le plug in (qui ne me semble pas avoir été modifié) ?

      Merci

    • Je m’auto réponds... Bien sûr, il faut retélécharger le plug in. Les noisettes nouvelles sont arrivées, permettant de tagger breves et rubriques. Merci encore.

    Répondre à ce message

  • Dans spip 2.0 beta 2 l’include ne se fait pas... il n’y a rien qui apparaît. Il semble que ce soit un pb avec cfg dans la mesure où l’insertion se fait au niveau du squelette, mais il n’y a rien qui s’inclu entre les balises <div class="socialtags"><ul> et </ul></div>

    Répondre à ce message

  • MisterRider

    Ca serait bien que le Social Tags s’ouvre dans une nouvelle fenetre. How do I do that ?

    Répondre à ce message

  • Parfait !

    Bon travail .. je l’ai intégré dans www.maroc-echecs.com (spip 1.9.2 d) ..
    j’ai juste supprimé les balises qui listes pour afficher les images verticalement ..

    Répondre à ce message

  • Bon, ben je vais y passer alors !

    Répondre à ce message

  • 3

    Super, j’attendais un truc du genre et comme j’ai pas eu la patience j’ai placé dans le squelette un bouton Add this, utilisé pour les articles de ce chapitre de mon site.

    Sur le principe je suis content que ça puisse se faire avec du code fait maison mais ça change quoi par rapport à leur bouton tout prêt ?

    • Ben... à première vue pas grand chose... sur l’objectif...

    • Ben ça permet de ne pas faire de pub grautuite pour addthis.
      Sinon serait-il possible d’intégrer VIADEO ?

    • D’un point de vue accessibilité et référencement, ce plugin fait bien mieux que ton script AddThis qui ne fonctionne qu’avec javascript et colle son code en haut de ta page, avant ton contenu à toi.

    Répondre à ce message

  • Apparemment, ça fonctionne très bien sous spip 1.9.2 version d. (je l’ai installé sur les articles de la partie news du site radiohead.fr . merci bien !

    Répondre à ce message

  • Excellent, toujours eu envie de le faire, mais jamais le courage. Bien joué

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom