Récupérez et affichez les informations EXIF de vos photographies

0

Vous connaissez forcément les données EXIF, qui permettent de tout savoir d’une photographie prise avec un appareil photo numérique (tout – ou plutôt l’essentiel). Comment les récupérer automatiquement et les afficher sur votre photoblog ?


Quand on affiche une photo dans un article, on n’a pas forcément l’utilité des données de prise de vue – en général. Il est même conseillé d’en supprimer certaines, dont les données de géolocalisation avant de publier vos photos personnelles sur le web.

Mais pour vous qui tenez un blog photo, les données EXIF peuvent avoir de l’importance. Soit que vous souhaitiez donner des informations techniques à vos lecteurs, soit qu’elles permettent de mieux comprendre la photographie elle-même.

À à f/1.8, la profondeur de champ d’un 20mm n’est pas la même que celle d’un 80mm, par exemple. De même, certains objectifs ont un rendu plus mou que d’autres. Une correction de l’exposition aura permis de réaliser un superbe contre-jour.

Mais comment extraire ces données, sans aller les chercher manuellement, photo par photo ? Vous avez deux possibilités : un traitement « brut » en PHP que vous ajoutez dans un thème enfant, ou vous passez par une extension dédiée. Moins souple, mais plus simple et plus rapide. Une extension existe, et en plus elle est gratuite…

Récupérer et afficher les données EXIF avec exifography

L’extension n’est pas testée avec la dernière version de WordPress (4.5.2 à ce jour). Ceci dit, elle fonctionne parfaitement, ce qui n’est pas surprenant quand on sait que sa créatrice, Kristen Symonds, alias kristarella travaille en tant qu’ingénieur pour Automattic, la société éditrice de WordPress – un code de qualité ne se périme pas du jour au lendemain.

Passons sur l’installation et l’activation, très simples – cliquez sur Extensions > Ajouter, saisissez « exifography » dans le champ de recherche, validez, cliquez sur installer maintenant puis sur activer l’extension.

En cliquant sur Réglages > Exifography, vous arrivez sur la page des options de l’extension :

Page des options d'Exifography
Page des options d’Exifography

Par défaut, les balises sont <ul>  et <li> , que j’ai remplacé par <div>  et <span> .  J’ai même rajouté une balise <span class="exif-name">  qui enveloppe l’élément EXIF, puis j’ai ajusté le style via les CSS.

À savoir : l’id de la balise <ul>  (ou <div> dans mon cas) est de forme wp-image-ID  ; pour éviter d’avoir deux id identiques et donc un conflit, vous pouvez remplacer <div id="%s" class="exif"> par <div id="exifography-%s" class="exif"> dans les options, ce qui vous donnera une id exifography-wp-image-ID.

Voici le résultat :

Le grand avantage de cette extension, c’est sa souplesse et sa facilité d’utilisation. L’inconvénient, c’est qu’elle ne permet pas une grande personnalisation, et n’affiche que certaines données EXIF.

C’est là que vous souhaiterez…

Récupérer et afficher les données en créant une fonction personnalisée

Si vos besoins vont au-delà de l’affichage des données EXIF en dessous de l’image, vous pouvez programmer votre propre fonction en PHP, puis l’intégrer dans le fichier functions.php  de votre thème, ou mieux, en passant par une extension telle que Code Snippets.

Pour afficher les données EXIF de l’image à la Une sur Pics & Stories par exemple, j’ai utilisé le code suivant :

Ces deux lignes sont les plus importantes, car maintenant vous avez toutes les données associées à votre média, dont les données EXIF. Reste à les récupérer, dans l’index ['image_meta']  du tableau $datas.

Vous allez obtenir un tableau de ce type :

Pour la vitesse d’obturation, si vous voulez l’afficher avec un format type 1/250 s, il vous faudra effectuer le calcul suivant :

De même pour la date de la prise de vue (au format habituel défini sur le blog), il faudra passer par :

Ce qui vous permettra d’afficher par exemple, pour le tableau donné ci-dessus :

Ici le code complet pour l’exemple précédent :

Bien sûr, il s’agit d’une ligne directrice, il va falloir tester l’existence de chaque donnée, et construire la chaîne à afficher en fonctions des données enregistrées.

Vous allez également récupérer d’autres données sur votre photographie via fonction wp_get_attachment_metadata , dont les dimensions.Le poids peut être trouvé via la fonction PHP filesize  :

Cette ligne de code vous donnera le poids, en Mo, avec une précision de 1 décimale. L’avantage d’une fonction personnalisée étant que vous avez une plus grande souplesse à l’utilisation, et que vous pourrez rajouter des données non EXIF mais pas moins intéressantes.

Vous pouvez voir ci-dessous un exemple d’utilisation de l’ensemble des données précitées, sur mon photoblog, Pixto :

Données EXIF
Données EXIF

Alternative intéressante à la fonction WordPress wp_get_attachment_metadata , la fonction PHP exif_read_data  qui vous donne davantage d’informations, à traiter un peu différemment (mais rien d’extraordinaire).

Avec le code suivant :

vous obtenez un tableau semblable à celui-ci :

En une seule passe, vous avez les données EXIF, la taille, le poids. À vous de traiter, et d’organiser ensuite, à votre guise.

En conclusion

Si vous souhaitez un affichage basique de vos données EXIF, exifography fera parfaitement l’affaire.

Cependant, si vous souhaitez aller plus loin, alléger votre site WordPress, vous affranchir des extensions ou des fonctions intégrées à votre thème, la création d’une fonction personnalisée n’est pas hors de portée, pour peu que vous ayez quelques connaissances en PHP.

Le Codex WordPress et le Code Reference vous aideront à aller plus loin, à approfondir votre connaissance de WordPress en mettant les mains dans le cambouis !

WordPress est un outil fascinant, avec une communauté de passionnés, et vous trouverez toujours le bout de code qu’il vous faut, une explication à défaut de solution toute prête en cas de problème, et même des consultants à prix abordable.

Alors lancez-vous, affichez vos données EXIF avec vos photographies, la valeur ajoutée est loin d’être négligeable !

Si vous avez trouvé une faute d’orthographe, veuillez sélectionner le texte en question et appuyer sur Ctrl + Entrée.

Partager…
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on Pinterest

Commenter

La modération des commentaires est activée. Votre commentaire peut prendre un certain temps avant d'apparaître.