Using SocialShare with WordPress to create custom social networks buttons

2013/02/14: Take care of the smarter caching system introduced in version 0.2.0.

Here is how to use the SocialShare PHP library to create custom Facebook, Twitter and Google Plus share buttons including the number of share.

The SocialShare library

Installing the library

The first step is to install SocialShare through the awesome Composer dependency manager. If you have not installed composer already, grab it!

In your custom WordPress themes directory (something like wp-content/themes/<mytheme-name>/), run the following command to get a copy of the library:

php /path/to/composer.phar require dunglas/php-socialshare:~0.1

Two Composer related files are created: composer.json and composer.lock. They contain the list dependencies of our project (only SocialShare for now). The code of SocialShare and Doctrine Cache (a dependecy of SocialShare) have been downloaded in the vendor/ directory.

Initializing SocialShare and creating helper functions

Put the following code in your theme’s functions.php file:

It loads the library through the Composer autoloading system, initializes a file based cache system (be sure to set a directory writable by your web server)  and loads Facebook, Twitter and Google Plus providers.

If you want to use other social networks such as Pinterest (bundled with SocialShare) or the newly supported LinkedIn, register them here.

Then, we create two helper functions to use in our theme’s templates: social_share_links that returns a share link and social_share_shares that returns the share counter. The last parameter of \SocialShare\SocialShare::getShares() function is set to true. This allows to delay the retrieving of share counts from social network when the \SocialShare\SocialShare::update() method will be called. If a value is already in the cache (how old it is doesn’t matter) it will be used, otherwise 0 will be returned.

Finally, we register the call to the update method on the WordPress’ shutdown hook. Thanks to this tweak, HTTP requests retrieving shares counts from social networks will be issued after the page load. Of course, only the next visitor will see updated counts, but this allows fast pages loading even in the worst case: when the data must be updated from social networks servers.

A last trick: if WordPress is served through PHP FPM (the most performant solution for PHP websites), we take care of the fastcgi_finish_request method. This method (only available when using PHP FPM) allows flushing the buffer and closing the connection to the client before retrieving data from social networks. By default, WordPress flush the response buffer but does not close the connection, even on FPM.

I’ve submitted a patch upstream using this trick to increase performance of all WordPress installations on PHP FPM, so I hope that the last lines of code will become unnecessary soon!

Using the helpers

You can now use the registered helpers in any template. Here is an example to put inside The WordPress Loop (e.g. content.php) to display a link to share the post and it’s number of share on Twitter, Facebook and Google Plus:

Customize the apparence of your social buttons with all the CSS you want!

Interconnectez blog, Twitter et Facebook pour démultiplier votre audience

Avant l’apparition des services de microblogging et des plateformes de réseautage social le canal de publication principal du blogueur était son blog (logique :P). Désormais nos écrits sont dispersés et notre audimat fragmenté. Messages courts à caractères professionnels sur Twitter, notices à l’intention de la totalité de notre graphe social sur Facebook ; articles détaillés, plus soignés et poussés sur notre blog. N’oublions pas non plus nos notes et favoris sur del.icio.us (je suis old shcool), nos photos sur Flickr, nos chansons préférées sur Last.fm, et les innombrables autres services web sur lesquels nous sévissons !

Afin d’accroître notre audimat sur tous ces différents supports, tous nos lecteurs doivent être notifiés de la publication de l’une de nos créations numériques, quelque soit le canal au(x)quel(s) ils sont abonnés. Voici quelques astuces qui vont nous permettre de relier ces différents supports entre eux.

Agrégation sociale avec Friendfeed

Le bien connu FriendFeed est un agrégateur social créé par quelques anciens employés de Google. Très bien réalisé, cette application en ligne permet de rapatrier en un unique endroit les activités que vous réalisez un peu partout sur le web. Une multitude de services sont supportés (dont les blockbusters que sont FaceBook et Twitter), il est aussi possible d’importer un simple flux RSS (pour notre blog par exemple ;)). FriendFeed permet également de s’abonner aux fils d’autres personnes et de commenter leurs activités.

logo de FriendFeed

“Très bien” me direz-vous, mais tout ce que l’on fait la c’est disperser un peu plus l’information (les commentaires sont sur FriendFeed, non pas sur le service concerné). C’est vrai, mais nous allons voir que centraliser toute notre activité internet va être bien utile.

Annonce automatique des nouveaux billets sur Twitter

Première opération : annonçons nos la publication d’un nouvel article sur le blog à nos followers Twitter. Pour ce faire nous pouvons utiliser notre compte FriendFeed fraîchement configuré et poster sur Twitter nos nouveaux articles comme bien d’autres notifications en provenance de services tiers !

logo de twitterfeed

Mais d’autres solutions s’offrent à nous. Pour plus de finesse voici twitterfeed : un service qui prend en entrée en flux RSS et envoi automatiquement un message sur votre compte Twitter dès qu’une nouvelle entrée y apparait. C’est parfait pour ce que nous voulons faire ! Entrez vos identifiants Twitter et l’adresse du flux RSS de votre blog. Tous nos followers sont désormais prévenu lorsque l’on publie un nouvel article !

Notez que pour vous connecter à ce service il vous faudra disposer d’un OpenID (les possesseurs de comptes Yahoo!, Blogger, AOL ou encore WordPress.com en ont déjà un).

Les utilisateurs de WordPress pouront également être intéressés par le plugin Twitter tools.

Rapatriement des tweets sur le blog (et bien plus)

Blog et microblog sont complémentaires. Maintenant que nos followers Twitter connaissent l’existence de nos articles, prévenons nos lecteurs traditionnels (et occasionels) qu’ils peuvent garder le contact via Twitter, et découvrir par la même occasion des informations intéréssantes en temps réel.

Plusieurs options s’offre à nous pour faire apparaitre quelques-uns de nos status sur notre blog. Twitter propose quelques widgets et il existe des plugins remplissant cet office pour la totalité des moteurs de blogs (en voici un autre pour WordPress et un pour DotClear). Mais encore une fois FriendFeed va venir à notre rescousse ! Le service fourni de nombreux widgets qui vont nous permettre d’incorporer à notre blog nos tweets ainsi que tout le reste de notre activité publique sur le net (photos Flickr, favoris del.icio.us, …). Pour ma part j’utilise le widget FriendFeed pour WordPress, plus personalisable et mieux intégré avec mon blog.

Recopier les tweets dans les statuts Facebook

Les statuts Facebook ne sont pas à négligés ! Grâce à l’audimat plus familier qu’ils touchent, ils génèrent souvent plus d’intérêts et de réactions que ceux publiés sur Twitter, publics mais noyés dans la masse. L’application Facebook fournie par Twitter permet de synchroniser les deux statuts. Une fois encore, FriendFeed peut servir. Une application Facebook répercutant dans nos statuts toute activité aggrégé par le service existe, malheureusement elle souffre d’un problème dans la gestion des encodages qui la rend moins attractive pour nous francophone.

Opération inverse : les statuts Facebook sur Twitter

Pour ceux qui publient plus sur Facebook que sur Twitter, il est possible d’effectuer la synchronisation dans l’autre sens. Rendez-vous sur vos “mini-news” depuis votre profil et sélectionnez “Historique des statuts”, une icône d’abonement à un flux RSS apparaît dans votre navigateur. Il vous suffit d’utiliser twitterfeed comme détaillé plus haut avec ce flux RSS afin de publier vos statuts Facebook sur Twitter !

Évitez d’activer la recopie vos statuts Twitter sur Facebook et de vos stauts Facebook sur Twitter… vous créériez une boucle !

Signaler sur Twitter les commentaires laissés sur un blog

Plus difficile à traquer, les commentaires que l’on laisse sur nos blogs favoris ne sont souvent lus que par les visiteurs du dit blog.

C’est la qu’intervient IntenseDebate, cet excellent système de gestion des commentaires tout juste resorti de bêta privé propose tout un tas de fonctionnalités plus pratiques les unes que les autres (notons l’automodération, l’affichage sous forme de fils de discussions et la synchronisation des commentaires entre différents billets liés sur différents blogs) dont une qui l’est plus particulièrement pour cet article : la possibilité de notifier sur notre compte Twitter que nous venons de publier un commentaire sur un blog !

Pour utiliser cette fonctionnalitée il vous suffit d’avoir un compte sur le site… et que le blog sur lequel vous publiez votre prose dispose du dit système de gestion de commentaires.

Les articles du blog sur le profil LinkedIn

Le site de réseautage professionel LinkedIn propose depuis peu la possibilité d’ajouter des applications OpenSocial sur les profils. L’une d’entre elles permet de leurs les derniers articles d’un blog et une autre plus spécifiquement ceux des blogs WordPress. Laissez l’opportunité à vos recruteurs, collaborateurs et clients de s’intéresser à vous, de découvrir vos capacités !

Vos différents canaux de communications sont maintenant interconnectés, vos lecteurs vont pouvoir profitez pleinement de vos talents 😉 ! N’hésitez pas à partagez vos propres astuces pour lier différentes applications web et élargir votre audimat dans les commentaires !

FeedBurner avec votre nom de domaine !

Peut-être utilisez vous FeedBurner pour gérer les flux RSS de votre blog. Savez-vous qu’il est possible d’utiliser votre propre nom de domaine avec les fils générés par ce service ?

Logo de FeedBurner

L’objectif est de faire s’abonner vos lecteurs à vos flux RSS via une adresse du type http://rss.monsite.com plutôt que http://feeds.feedburner.com/.

Pourquoi ça ?

  • Pour conserver l’identité de votre blog : ce que l’on regarde en premier pour déterminer l’origine d’un article c’est le nom de domaine qui lui est associé
  • Pour ne pas être dépendant d’un service externe et pouvoir arrêter de l’utiliser sans perdre d’audience
  • De faire bénéficier du Page Rank assigné aux contenu de vos flux à votre domaine plutôt qu’à feedburner.com

Comment faire ?

Dans l’interface de gestion de votre nom de domaine ou sur votre serveur DNS créez un alias (type CNAME) nommé “rss.monsite.com” qui pointe vers “feeds.feedburner.com.“. Si vous éditez manuellement la configuration de votre serveur DNS, l’entrée doit ressembler à :

rss IN CNAME feeds.feedburner.com.

N’oubliez pas le point final qui indique que l’on fait référence à un chemin absolu. Après avoir attendu que les caches DNS se vident, tentez de vous connecter à votre flux en remplaçant feeds.feedburner.com par rss.monsite.com. Pour mon blog ça donne http://rss.dunglas.fr/. Si ça fonctionne, la partie DNS est opérationnel.

Il faut maintenant activer le service dans FeedBurner. Connectez-vous sur feedburner.com et rendez-vous dans My Account puis dans MyBrand, entrez le nom de domaine que vous avez choisi pour vos flux et validez. Voilà, c’est terminé !

Si vous utilisez WordPress et son plugin FeedBurner de Steve Smith, rendez-vous simplement dans Options -> FeedBurner et remplacez les adresses en feeds.feedburner.com par celle que l’on vient de créer !

Happy Burning !

Plugin Scoopeo pour WordPress v0.3

Voici une nouvelle version de mon plugin qui permet d’intégrer Scoopeo à WordPress. Au programme :

  • Affichage des commentaires dans l’ordre chronologique
  • Suppression des erreurs et des en-têtes inutiles lorsqu’il n’y a pas de commentaires Scoopeo associés à une page
  • Affichage des dates en français
  • Lien vers la page de l’auteur du commentaire

Télécharger le plugin Scoopeo pour WordPress version 0.3

Plugin pour intégrer Scoopeo à votre blog WordPress

Scoopeo, c’est le plus populaire des digg-like francophone. Scoopeo est un aggrégateur de liens. Ceux-ci sont classés suivant les votes des visiteurs. Le site permet également de poster des commentaires à propos des pages publiées.

C’est une pratique répandue chez les blogueurs de faire apparaître leurs articles sur les sites webs sociaux tels que Scoopeo, Blogasty ou encore Wikio. C’est une manière efficace de leurs assurer une forte visibilité et de générer du traffic sur leur blog.

J’ai développé un plugin pour WordPress, un moteur de blog très répandu qui permet :

  • De voir le nombre de “clic” et de voter directement depuis les articles publiés
  • De rappatrier les commentaires postés à propos de vos articles sur Scoopeo à la suite des commentaires classiques

Ce plugin permet de maximiser le nombre de votes reçus pour vos articles, car vos visiteurs peuvent voter simplement même s’ils ne sont pas arrivés sur la page depuis Scoopeo. Il rapatrie également tout le contenu associé à votre article (les commentaires Scoopeo), tous les visiteurs pouvant ainsi en profiter.

Note : le plugin existe désormais en version 0.3.

Télécharger le plugin d’intégration de Scoopeo à WordPress

Installation

  1. Décompressez le fichier scoopeo-0.2.zip
  2. Transférez le fichier scoopeo.php dans le répertoire wp-content/plugins
  3. Activez le plugin depuis le menu Plugins du Tableau de bord
  4. Placez <?php the_scoopeo_clicker (); ?> dans vos templates pour afficher le clicker. Par exemple après <?php the_content('» Lire la suite...'); ?> dans index.php et single.php (Modèle de l’index principal et Article seul depuis l’éditeur de thème).
  5. Placez <?php the_scoopeo_comments (); ?> dans vos templates pour afficher les commentaires postés sur Scoopeo. Par exemple après <?php if ('open' == $post-> comment_status) : ?> dans comments.php (Commentaires depuis l’éditeur de thème).

C’est tout, le plugin est installé !

Todo :

  • Convertir les dates du format RSS au format français
  • Trouver le lien pour répondre sur Scoopeo
  • Récupérer les “alt url”

Notes :

Sécurisez votre blog WordPress !

L’installation par défaut de WordPress pose quelques gênants problèmes de sécurité. Nous allons nous employer à les corriger.

Cachez le contenu des répertoires internes

Par défaut, WordPress ne bloque pas l’accès à tous les répertoires nécessaires à son fonctionnement que le public ne devrait pas pouvoir consulter. C’est le cas du très sensible répertoire wp-content/plugins. Les plugins que vous installez peuvent avoir étaient développés par des programmeurs novices ou ne pas avoir été correctement audités et contenir des failles de sécurité. Par défaut, WordPress permet à n’importe qui de lister les plugins que vous avez installé. Pour y remédier, entrez la ligne suivante dans votre fichier .htaccess, à la racine de votre répertoire :
Options -Indexes
Désormais, si un curieux tente d’accéder à des répertoires sensibles, il ne verra qu’une erreur 403.

Supprimez le numéro de version des meta-tags

De nombreux thèmes WordPress dont celui par défaut affichent un vilain meta-tag :
<meta name="generator" content="WordPress 2.3.3" /> <!-- leave this for stats please -->
Le petit commentaire associé ni changera rien, ce meta-tag est une très mauvaise idée ! Il permet aux pirates de connaitre instantanément quelle version du logiciel vous utilisez et quelles sont les failles de sécurité qui la touchent. Il pourrait même permettre à un robot d’attaquer massivement les sites utilisant des WordPress non mis-à-jour.

La aussi, la correction est simple, ouvrez le fichier header.php de votre thème (dans le répertoire wp-content/themes/default/ pour le thème par défaut) et cherchez :
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats -->
Si vous êtes sans états d’âmes pour les statistiques de WordPress supprimez simplement la ligne, sinon remplacez-la par :
<meta name="generator" content="WordPress" /> <!-- leave this for stats -->
Espérons que WordPress 2.5 corrigera ces problèmes.

Pour finir, quelques conseils en vrac

  • Bien-entendu, veillez à toujours tenir à jour votre WordPress et tous ses plugins.
  • Désactivez et supprimez les plugins que vous n’utilisez pas.
  • N’hésitez pas à renforcer la protection du dossier wp-admin/ par un fichier .htaccess.
  • Masquez également la version d’Apache et de PHP utilisée en mettant ServerTokens à Prod.