Nouvelle version de ce petit plugin, inspiré par daScritch qui m’a pas mal mâché le boulot et qui a pour seule fonction de mettre en place, dans l’entête de la page HTML des billets et/ou des pages, les métadonnées « sociales » utilisées par Facebook, Google+ et Twitter.
Cette version permet de sélectionner le jeu de métadonnées à insérer parmi celles utilisées par Facebook, Google+ et Twitter ; de préciser si le blog est un photoblog pour forcer l’usage d’une carte Twitter d’un type dédié et pour utiliser la première image en taille réelle plutôt qu’une miniature — à n’utiliser que si vos images ne font pas plus d’un méga-octet ! ; et de définir une description par défaut utilisée en l’absence de texte dans votre billet (ou page).
Le plugin, une fois installé, s’active via le menu Blog et est intitulé socialMeta.
En prenant ce billet pour exemple, voilà ce qu’il introduit dans l’entête de la page HTML :
<!-- Facebook --> <meta property="og:title" content="Ma sélection photo 2013" /> <meta property="og:description" content="Un aperçu rapide de l’année 2013, question photo. Je photographie moins j’ai l’impression, quoique je me sois bien rattrapé pendant la dernière édition de Paris-Web. En vedette" /> <meta property="og:image" content="http://open-time.net/public/dcim/2013/06/01/.IMG_8828_s.jpg" /> <!-- Google +1 --> <meta itemprop="name" content="Ma sélection photo 2013" /> <meta itemprop="description" content="Un aperçu rapide de l’année 2013, question photo. Je photographie moins j’ai l’impression, quoique je me sois bien rattrapé pendant la dernière édition de Paris-Web. En vedette" /> <meta itemprop="image" content="http://open-time.net/public/dcim/2013/06/01/.IMG_8828_s.jpg" /> <!-- Twitter --> <meta name="twitter:card" content="summary" /> <meta name="twitter:url" content="http://open-time.net/post/2014/01/13/Ma-selection-photo-2013" /> <meta name="twitter:title" content="Ma sélection photo 2013" /> <meta name="twitter:description" content="Un aperçu rapide de l’année 2013, question photo. Je photographie moins j’ai l’impression, quoique je me sois bien rattrapé pendant la dernière édition de Paris-Web. En vedette" /> <meta name="twitter:image:src" content="http://open-time.net/public/dcim/2013/06/01/.IMG_8828_s.jpg"/> <meta name="twitter:site" content="@franckpaul" /> <meta name="twitter:creator" content="@franckpaul" />
Ce billet servira de support pour cette version du plugin.
1 De i_love_dc -
Hello franck
Merci pour cette maj, l’option pour activer / désactiver telle ou telle méta (facebook; google+, twitter) tombe à pique :)
Du coup en désactivant google+ le validateur ne hurle plus et tout est bien valide.
Et ca tombe bien puisque google+ ou facebook interprètent très bien les <meta property=”og:title / descritpion/ image”> donc plus besoin des <meta itemprop=”name / description / image”> qui énervaient le validateur.
merci encore :)
2 De Julien -
Hello, le plugin marche bien, il manque juste quelques balises selon les specs twitter/facebook :
- og:url
- og:sitename (optionnel mais recommandé)
- og:image (optionnel, 1ere du billet ou une générique)
- twitter:image (même pour un type summary = petite vignette, c’est pas obligatoire mais c’est mieux)
- twitter:image:alt (le alt de l’image ci-dessus)
- et twitter:url n’existe pas dans la spec.
sources :
http://ogp.me/
https://dev.twitter.com/cards/types…
3 De Franck -
Merci Julien, je m’occupe de ça ASAP ;-)
4 De Franck -
Nouvelle version dispo (corrige quelques erreurs et omissions que tu m’as indiqué Julien).
Pour l’instant je n’ai pas implémenté d’image par défaut pour le blog, par contre si le billet n’en possède pas et qu’il appartient à une catégorie qui en possède une dans sa description, c’est cette dernière qui sera utilisée.