Adding EXIF information to Lightbox
-
Just sharing how I added EXIF info (IF your pictures have the info) to the lightbox picture preview. There are probably other ways, but this is the way I did it (see my site for sample). You should be comfortable editing code.
This hack will display the following info:
- Camera
- Focal length
- Shutter speed
- Aperture
- ISO
- Date/Time Takes
NOTES:
- An undesired effect of this mod is: when you hover your mouse at the border of the gallery pictures the ToolTip will display the ahref title (i.e. all the html code for exif info will be shown). I don’t know how to resolve this EASILY.
- I wanted to add the camera “manufacturer” information, but all my efforts failed. Maybe someone can suggest how to do it.
- I hope this can be integrated as an option into NextGen in the next release.
You need to add some code into the file /wp-content/plugins/nextgen-gallery/nggfunctions.php:
1. First, create a copy of nggfunctions.php (e.g. nggfunctions.orig.php). In case you mess it up you have something to revert back to.
2. Next, look for the lne “function nggCreateGallery”
3. In that function, find this line:
$picturelist[$key]->description =
4. Replace that line with:
`$exif_info = “<div style=’float:left; clear:both; margin:0px 10px 10px 0px; background-color:#050607; width:100%’>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>Camera:</b> <font color=’#FFFF88′>”.$picturelist[$key]->meta_data[‘camera’].”</font></div>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>Focal length:</b> <font color=’white’>”.$picturelist[$key]->meta_data[‘focal_length’].”</font></div>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>Shutter Speed:</b> <font color=’white’>”.$picturelist[$key]->meta_data[‘shutter_speed’].”</font></div>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>Aperture:</b> <font color=’white’>”.$picturelist[$key]->meta_data[‘aperture’].”</font></div>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>ISO :</b> <font color=’white’>”.$picturelist[$key]->meta_data[‘iso’].”</font></div>”;
$exif_info = $exif_info.”<div style=’float:left; margin:0px 10px 0px 10px; font-size:x-small;’><b>Taken :</b> <font color=’white’>”.$picturelist[$key]->meta_data[‘created_timestamp’].”</font></div>”;
$exif_info = $exif_info.”</div>”;$picturelist[$key]->description = ( empty($picture->description) ) ? ‘ ‘.$exif_info : htmlspecialchars ( stripslashes(nggGallery::i18n($picture->description)) ).$exif_info;`
- The topic ‘Adding EXIF information to Lightbox’ is closed to new replies.