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.
Discussions par date d’activité
240 discussions
serait-il possible d’ajouter le réseau professionnel Linkedin ?
Merci pour cette superbe contribution !
merci d’avance
Répondre à ce message
Pas réussi à faire marcher sur une 192, ni avec la noisette, ni en automatique. Du coup j’ai simplement recopié les liens adaptés avec #url_article et (#titre et les icones...
Dommage mais pas grave finalement !
En ce qui concerne la noisette, dans la page de configuration de socialtages, préciser #socialtags comme sélecteur cible.
Pour info : inventaire des 50 services disponibles ce jour : Bebo, Blogmarks, BlogMemes, Bluegger, CiteULike, Connotea, Digg, Diigo, Del.icio.us, DZone, Facebook, Faves, Furl, Google, Health ranker, JoOok, Les Humains Associés, linkaGoGo, LinkARENA, Live, Menéame, Mister wong, Mixx, MySpace, Netvouz, Newsvine, Nuouz, Pioche, Plurk, Propeller, Reddit, Scoopeo, simpy, Slashdot, Spurl, Startaid, StumbleUpon, TagTooga, Tapemoi !, Technorati, ThisNext, Tumblr, TUTMarks, Twine, Twitter, Viadeo, Wikio, Yahoo ! Bookmarks, Yahoo ! Buzz, Yahoo ! MyWeb
Répondre à ce message
Serait-il possible d’ajouter Twitt this ?
Répondre à ce message
Phil : je viens de modifier le plugin pour qu’il s’insère sur les pages via javascript et #INSERT_HEAD, ce qui fait qu’on n’a plus du tout besoin des noisettes. Pour l’instant je laisse l’option, pour qu’on teste un peu, et qu’on en discute.
une fois social installé, les articles réclament les noisettes... sinon bug
Répondre à ce message
Merci beaucoup pour ce greffon. Il permet encore plus d’interactivité pour les sites sous spip.
J’ai installé la version 2.0.3 de spip et j’utilise Social tags 0.2. Le problème est que la page /plugin/socialtags/socialtags.css n’est pas chargée avec la noisette [(#INCLUREfond=noisettes/socialtagsid_article)]
Pour que cela fonctionne sur mon site, j’ai du copier/coller le css dans /squelettes/habillage.css
Y-t-il une raison particulière ?
Et encore merci pour la contribution !
Répondre à ce message
Bonjour,
Est il possible d’intégrer HI5 svp ?
Merci bien
C’est du logiciel libre, les sources sont la http://zone.spip.org/trac/spip-zone/browser/_plugins_/_stable_/socialtags, n’hesitez pas à l’enrichir avec vos réseaux préférés.
Répondre à ce message
Viadéo et MySpace sont ajoutés...
Bonjour,
Nous utilisons Flickr avec ses diverses fonctionnalités...
Est-il possible de l’intégrer ?
Bien sincèrement.
Michel
Pour exemples :
...
Répondre à ce message
Bonjour,
J’ai rajouté le plugin social tags et j’ai mon lien facebook et google book marks. Mais comment faire le lien entre l’icone facebook et mes artcicles publier dans facebook ?
Merci de m’aider
Répondre à ce message
Je confirme que le lien Wikio n’affiche que la page d’accueil
Répondre à ce message
Bonjour,
merci pour ce plugin !
Il y a un souci par contre, le lien vers wikio redirige vers la page d’accueil. De plus, wikio.com n’affiche que les articles en anglais. Si c’est possible, il faudrait rajouter la possibilité d’activer wikio.com, .it, .fr... dans les configs.
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 :
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.
Suivre les commentaires :
|
