I would like to have a random image on the front page that changes when the page is reloaded. I would also like to have a description under each picture that is extracted from the EXIF data. Ideally this would be a script that sits in the images folder randomly choosing from the photographs in that folder.
This is a script question rather than a graphics question so let me know whether you are looking for Javascript solution or [URL=“http://www.v-nessa.net/2010/08/02/using-php-to-extract-image-exif-data”]PHP solution and I’ll move it to the appropriate forum.
Thank you - I guess either are possible.
Moved to PHP Forum as seems more appropriate to topic
You can randomize the images JavaScript but you cannot read EXIF data via JavaScript. Hence PHP is the more appropriate solution. If you have a moderate number of images in a folder e.g. /images/for/slideshow/ (say between 1 and 100) you can tweak this bit of code:
<?php
$images = glob('/images/for/slideshow/*.jpg'); // get all images from the directory
shuffle($images); // shuffle the array (re-arranges the items randomly)
$image = $images[0]; // the array was shuffled, just grab the first image
$exif = exif_read_data($image); // Note: requires php_mbstring and php_exif modules
var_dump($exif); // to debug the information contained in $exif
echo '<img src="' . $image . '"/><br/>';
echo 'Software: ' . @$exif['Software'] . '<br/>';
?>
PS: Sorry I couldn’t test the above mentioned code thoroughly. I do not seem to have any sample images that contain exif data.
In webdesignhouston’s example it will display the EXIF value for “software”. You can specify what EXIF data you want displayed e.g.
echo 'Exposure: ' . @$exif['ExposureTime'] . '<br/>';
F number will need a calculation as it might come up as 56/10 - check out the php EXIF pages
Some file types like php do not contain EXIF data and some jpg images might not have any so you should work that into your code as well.
Thanks for your help.
That works brilliantly.
It is working fine now except for a slight styling issue. I am trying to get the text to indent by 20 pixels but when I set up a css class it also moves the image by 20 pixels. Is there a away of just setting a class for the exif software line in your example.
Wrap a <div> around the software line and style it there?
you need to enable exif extension in your php configs.
To display text alongside the image (baselines aligned on same line):
<img src="foobar.gif"><span style="padding-left: 20px">some text</span>
This might also work:
<img src="foobar.gif" style="margin-right: 20px">some text
Just drag the image back into position.
.test {padding-left:20px}
.test img{margin-left:-20px;}
The code below I am using which is working great from webdesignhouston, brilliant.
I am struggling however with styling the text I have tried all the options mentioned here and every time I try it it just breaks the code and does not show the page. I would like the exif text to be in from the left by 20px and leave the picture where it is.
<?php
$images = glob('images/Random/*.jpg'); // get all images from the directory
shuffle($images); // shuffle the array (re-arranges the items randomly)
$image = $images[0]; // the array was shuffled, just grab the first image
$exif = exif_read_data($image); // Note: requires php_mbstring and php_exif modules
//var_dump($exif); // to debug the information contained in $exif
echo '<img src="' . $image . '"/><br/>';
echo '' . @$exif['ImageDescription'] . '<br/>';
?>
why use exif? when be rand() function 
?
first create mysql table and create varchar column for image path.
after save image path in column and select mysql_query().
For example:
<?php
$sql = “select image_path from images limit 0,1 order by " .rand(). " ;”;
$query = mysql_query($sql);
?>
Your veriable in $query after print screen with -while-.
Requires only rand() function.
That’s what my code would do if properly implemented.
If there are conflicts with other code in that section then why not just output a span around the image description in your php (with a class name applied if your structure doesn’t allow it to be targeted uniquely) and then set it to display:block and apply some padding-left. No need for a break then.