I haven't had a techie post in a while, so I thought I would let you know what I have been piddling with at the office. I suddenly became in desperate need of a way to rotate pictures on our website and didn't have a clue how to make that happen. After many hours of scouring the web I ran across this page by Matt Mullenweg:
http://photomatt.net/scripts/randomimage
Basically, you create a .PHP file and drop it in a (web accessible) folder then put a link to the .PHP file where you want the pictures to show up. SCORE! No typing in the names of each picture! This was hugely important to me, as I truly hate having to go line by line typing in a picture list. The only down side was that it would only show one picture.. Yes it was random and yes it saved a lot if time but you know me, it did not rotate them out with out reloading the page and I wanted MORE. So after a little time well spent banging my head against the monitors on my desk I figured out that I could combine this imminently awesome PHP file with of all things, a HTML file with the link inside as a source for an iFrame. Uhmm.. here let me Try this again..
Basically, you create a .PHP file and drop it in a (web accessible) folder then put a link to the .PHP file where you want the pictures to show up. SCORE! No typing in the names of each picture! This was hugely important to me, as I truly hate having to go line by line typing in a picture list. The only down side was that it would only show one picture.. Yes it was random and yes it saved a lot if time but you know me, it did not rotate them out with out reloading the page and I wanted MORE. So after a little time well spent banging my head against the monitors on my desk I figured out that I could combine this imminently awesome PHP file with of all things, a HTML file with the link inside as a source for an iFrame. Uhmm.. here let me Try this again..
Things you need:
The code from the link above.
An empty HTML file
A page to encapsulate every thing in.
Copy the code on Matt's page into a text file, name it rotator.php and save it to a folder that has a bunch of pictures in it. For this example I will use the directory "pictures" and is accessible from my website with this address <sitename>\pictures. Next create a HTML file in the root of your website folder and name it picrotate.html.
In the head section type this line:
<meta http-equiv="refresh" content="5;url=/picrotate.htm">
In body of the HTML file save this line:
<img src="/pictures/rotator.php">
Now in the page that you want the picture to be seen on use an iframe like this:
<iframe src="/picrotate.htm" frameborder="0" scrolling="no">
</iframe>
After you save this file you should have rotator.php called from picrotate.htm which is called from the page where you want to see the picture. The meta tag will cause picrotate.htm to be redirected to itself every 5 seconds causing rotator.php to be reloaded and will display a new random picture from the folder. It is beyond the scope of this post to get into page formating, but I will say this: div tags are the best thing to happen to websites in a long time!
This may seem convoluted, but it does work. If you want to see it in use, go to my video board page here http://www.calvertisd.com/index.php?page=tv-out This is shown on a 42" flat screen TV in one of our hallways. Enjoy!
NOTE: If you are doing this on a more public page, I would suggest that you increase the meta refresh value to at least 15 or 20 seconds. and use a program to reduce the over-all size of your pictures. Most cameras today take pictures that are in the 5-10MB (very large) range and is way too big to be useful on a website. I recommend Gimp and the ever useful DBP (David's Batch Processor) plugin, both are free.
Posted via email from Musings, Ramblings and Other Assorted Rubbish
