UPDATE: December 9, 2007: The Random Image Plugin has been updated! Please see the new post for updates on features, or to comment.
Have you ever wanted to display a random image from a folder on your site? Maybe for a background or banner for your blog? Now there’s a quick and easy way to do it: the Random Image Selector plugin for wordpress!
The initial release, version 1.0.2 is available from the Wordpress.org plugins site. The download location is http://wordpress.org/extend/plugins/random-image-selector/
The premise of the plugin is quite simple, create a folder on your website where you want to store your randomly selected files. The plugin will select from all the files in that folder, and choose one at random to display. This is a great way to create a random, rotating header for your blog, or even *GASP* a primitive ad-rotator.
- Extract randomImage.php into your wp-content/plugins folder (or a subfolder)
- Activate the plugin in Wordpress
- On the options screen, select the “Random Image” menu
- Fill in the values for your physical and http paths
- Add some code to whatever page you want to display the image. This is a great way to customize the header image for your wordpress installation. The plugin will look in the folder and randomly select a header image to display.
Sample Code:
<?php
if (function_exists('generateRandomImgTag'))
{
generateRandomImgTag();
}
?>
I welcome any comments, feedback or suggestions for future iterations. I’ve got a few ideas myself. I would like to thank Stefan, one of the early adopters, for his feedback and corrections for the documentation. For another look at the plugin in action visit his site stefanmedia.
72 responses so far ↓
1 Ed // Jul 26, 2007 at 4:32 pm
Many thanks, this plugin works a treat. Have been waiting some time for this, at least one that worked well.
Cheers, Ed
2 nico // Jul 27, 2007 at 3:12 pm
How would you insert the code if you also want the image to have a link?
It would be cool to have the sample code in the options page, to copy paste lazy way.
3 kdmurray // Jul 27, 2007 at 11:51 pm
Thanks for the feedback Ed and Nico. I’ve updated the options page documentation to include the sample from the readme file.
As to your question about the link it could be done in one of two ways, either inside or outside the PHP function call. Outside is the easiest:
<a href=”http://kdmurray.net/” >
<?php<br /><br />
if (function_exists(’generateRandomImgTag’))
{
generateRandomImgTag();
}
?>
</a>
The other method is to insert some code around the “generateRandomImgTag()” function call, but this is a bit more complex, and yields essentially the same result.
4 nico // Jul 28, 2007 at 6:44 am
thanks!
will that open in an external window?
5 nico // Jul 28, 2007 at 6:52 am
hey, I tried thhat code, and it shows on text:
if (function_exists(’generateRandomImgTag’))
{
generateRandomImgTag();
}
?>
Am I missing something?
6 kdmurray // Jul 28, 2007 at 10:46 am
Sometimes copying & pasting the code from a web-page can yield strange results if you paste it directly into a WYSIWIG editor. It can turn the angle brackets into strange codes…
As for opening the link in a new window, add the text: target=”_blank” right after the href=”somesite.com”
A good html tutorial is also available at w3schools.com.
7 nico // Jul 28, 2007 at 11:46 am
great resource, thank you!
8 Marisol // Jul 30, 2007 at 1:07 pm
Hi!
I have just downloaded and installed the randomImage.php, But I can´t get it right.
I have followed the instructions exactly as you said, but I get the error message (in my sidebar):
Warning: opendir(/web/marisol.se/wordpress/randomimages/) [function.opendir]: failed to open dir: No such file or directory in /home/.jayce/marisol/web/marisol.se/wordpress/wp-content/plugins/randomImage.php on line 134
Warning: readdir(): supplied argument is not a valid Directory resource in /home/.jayce/marisol/web/marisol.se/wordpress/wp-content/plugins/randomImage.php on line 136
I have created a new folder under marisol.se/wordpress/randomimages and put the php text in my sidebar, but nothing
I must be doing something wrong, but what am I missing?
9 kdmurray // Jul 30, 2007 at 6:09 pm
Hi Marisol,
You just need to use the entire path when you put in the physical path to the folder. The hint is in the error message:
Try using:
/home/.jayce/marisol/web/marisol.se/wordpress/
I suspect that will work out for you.
10 Marisol again // Jul 31, 2007 at 1:43 am
Gosh… it works…
Thank you so much for your help!
11 tarek // Aug 10, 2007 at 4:21 pm
hi thanks for this script, I have just littl eproblem there allways two image in my page. I would kike two show just one image not two. thanks
12 kdmurray // Aug 11, 2007 at 9:52 am
@tarek: Can you provide me a link to your page, or a copy of the code you used so I can help?
13 tarek // Aug 12, 2007 at 10:26 am
Hi kdmurray,
thank’s, hier ist the link (I still working on it) http://www.gomres.com/wordpress
14 Rosina Lippi // Aug 13, 2007 at 10:56 pm
I’m guessing that the plugin can’t resize images… they have to be exactly the size you want to start with. Right?
Thanks for all your hard work.
15 kdmurray // Aug 13, 2007 at 11:04 pm
Thanks for the feedback, Rosina.
Currently it doesn’t. Though that’s an excellent suggestion for a future version.
16 Rick Hepting // Aug 19, 2007 at 2:51 pm
This plugin works great. I love it.
This may be a stupid question (I’m non-geek enough to not know…) but is there a way to use two of these on a page, one each for different sets of photos?
17 kdmurray // Aug 22, 2007 at 6:47 am
Hi Rick,
At the moment, there’s no way to pull from different pools… (at least not easily). You could do it by:
1. Make a copy of the .php file, name it something unique.
2. Edit the .php file for the plugin, and change the plugin name in the header
3. Edit the .php file and change the variable names that are stored in the wordpress database
4. Activate the second copy of the plugin (under the new name) and set the variables accordingly. (If they’re already filled, then the variable names haven’t been changed).
Not the simplest instructions, I know. Perhaps this feature will make a later version as well.
18 Rick Hepting // Aug 22, 2007 at 5:08 pm
Thank you for answering, but it’s beyond my abilities. Maybe I was just getting greedy.
The plugin works great.
19 kdmurray // Aug 22, 2007 at 6:20 pm
Thanks again for the feedback, Rick. I realize it’s not a simple task… heck, I wouldn’t even tackle modifications like that most of the time.
20 Hanek // Aug 23, 2007 at 12:46 am
Could you please explain to me where to insert this in the header.php code?
Currently the static background is generated from the CSS and the background image is found in the header.php as follows
/”>
Where should I place this without messing up the position of the header within the CSS?
Thanks for your time.
21 Ricardo // Aug 24, 2007 at 12:04 am
us there any way just to show a thumbnail instead of the whole picture?
22 Fabrix // Aug 24, 2007 at 7:42 am
I have made a Widget Random Image so you can dispaly random images on your sidebar without coding.
Here you can download the source:
http://www.blogjobs.it/2007/08/24/wordpress-widget-plugin-random-image-gallery/
bye,
fabrix
23 David // Sep 1, 2007 at 6:41 pm
Help please!
Under “Set up your Random Image Options”, I have
1. Enter the path (full path) of the folder you would like to pull the images from.
I do not know what this pasth is. How would I find out? I am using a Plesk server.
2. Enter the corresponding URL path (full path) of the folder
http://www.realfaith.ca/images/randomphotos/
Here is a sample photo
http://www.realfaith.ca/images/randomphotos/01.jpg
So I would appreciate your help with the path (full path) of the folder in #1 above.
Thanks!
24 kdmurray // Sep 4, 2007 at 7:06 am
Hi David,
There’s no way for me to know for sure… but if you have FTP access to your site, ｔｒｙ using the path that it shows you there. It will probably look something like:
/users/david/www/realfaith.ca/some_folder/
Alternately, if you have SSH access to your site, type in the command pwd when you’re in the folder and it will give you the path.
Failing that, fire a note to your hosting company and just ask them for the physical path. Should’t take any real effort on their part.
25 Garus Booth // Sep 4, 2007 at 2:46 pm
Hey,
I have installed this plug in and am really happy with it.
But was wondering if there is a way to have a unique link for each random image.
So if some one gives me an image I can have it link to there site.
any ideas?
26 kdmurray // Sep 6, 2007 at 7:35 pm
Hi Garus,
At this point, there’s no facility for individual links, but it’s something I’m looking into for a future version…
27 Benjamin Duranske // Sep 11, 2007 at 6:38 pm
Is there any way to stick image formatting (e.g. border, padding, etc.) on these? I can’t see where to stick the code.
28 kdmurray // Sep 11, 2007 at 6:41 pm
Currently no… you’d have to edit the plugin yourself to put that in. Looks like it might be time to release a new version of the plugin.
29 Neepster // Sep 17, 2007 at 11:50 pm
Hmm… I’m trying to use this to rotate the Kubrick images at the top of my default theme site, but not sure how to do it. Any suggestions? I have the Kubrick images, but the header file just references the style.css file but it doesn’t seem to work if i just replace #header {
background: #73a0c5 url(’images/kubrickheader.jpg’) no-repeat bottom center;
}
with the
30 Dustin // Sep 21, 2007 at 8:07 am
First off. Thanks for a great plugin! I have three suggestions for your next release; Make the plugin into a widget, make it work with plugins like lighthouse and shudder reloaded, and have it ignore thumbnails. Thanks again!
-Dustin
31 Dustin // Sep 21, 2007 at 9:26 am
Change the following line in the generateRandomImgTag() function and those pesky thumbnails go away.
if(in_array(strtolower(substr($image_file,-3)),$image_types) and substr($image_file,-13,9)!=’thumbnail’)
32 jason // Sep 24, 2007 at 6:50 pm
Hi,
First off, thanks for making this.
I’m having some technical difficulties. I am trying to insert this into a Page on my blog, which I have set to be the homepage.
Where exactly is the little piece of code supposed to pasted? Do I edit the body of page, and paste the code in there? Because when I do, it just shows up as copy. Or do i paste it into the page.php file?
Also, what’s the best way to figure out the full path? Like when you say “myuser” in the example, is that supposed to be my username to log in to my FTP, or my username on my computer? Sorry to be so specific, but this is the only way I can explain it.
Thanks!
33 kdmurray // Sep 24, 2007 at 9:35 pm
@Neepster: The changes need to be made in the template files (like the header file) and not in the stylesheet.
@Jason: Similar answer, at this point changes need to go within the PHP files which make up the theme. The only way to implement it the way you’ve tried would be to add a plugin like Inline PHP that will allow you to drop PHP Code into pages & posts. Be careful with this approach however as it can easily cause unexpected consequences…
@Dustin: Thanks for the suggestions, I’ll definitely have to add an option to exclude thumbnails into an upcoming version. I hadn’t thought about that.
34 James R // Sep 26, 2007 at 7:39 am
I have Random Image Selector working in a test file but I am using the theme ‘digg-3-col’ and I think I really need to put the Random Image Selector PHP code into the themes style sheet (see below) as I want this themes header to change on every load using Random Image Selector …
#header{
margin: 0 0 10px;
float: left;
width: 904px;
height: 250px;
background: url(images/bg_header.gif) no-repeat left bottom;
color: #333;
}
Can I place the PHP code into the line …
background: url(images/bg_header.gif) no-repeat left bottom;
color: #333;’
I tried it but it did not work
What should I do?
35 kdmurray // Sep 26, 2007 at 5:29 pm
Hi James, this is the same issue as Neepster was having.
You’ll need to remove the background line from the stylesheet, and just add that image into the header.php file manually.
36 DXK // Oct 2, 2007 at 12:30 pm
Hello,
I’m having the same issue as James.
In my style.css is this line:
#header {
text-align:left;
width: 658px;
padding:0px;
margin:0px;
position: relative;
height: 200px;
background-image: url(images/header.jpg);
}
I need to delete this?
But then?
What do I need to add in header.php?
I’m using this theme:
Black Minimalism
Hopefully somebody can help this noob
37 mark // Oct 5, 2007 at 2:58 pm
kdmurray said: “You’ll need to remove the background line from the stylesheet, and just add that image into the header.php file manually.”
——
i second the request. could you please explain how this is to be done exactly? thanks so much.
38 kdmurray // Oct 5, 2007 at 3:02 pm
In the stylesheet, there is a line:
background-image: url(images/header.jpg);
Remove it.
In your header.php file, find the spot where the header image block goes (this varies from theme to theme), and drop in the code that I’ve put in the readme.
39 DXK // Oct 15, 2007 at 11:55 am
Thanks Kdmurray!
I’m 1 step futher now, but now I get this:
Warning: opendir() [function.opendir]: open_basedir restriction in effect. File(/domains/d-x-k.nl/public_html/random/) is not within the allowed path(s): (/home/deb5485/:/tmp:/usr/local/lib/php/) in /usr/home/deb5485/domains/blabla.nl/public_html/website/wp-content/plugins/random-image-selector/randomImage.php on line 134
Warning: opendir(/domains/blabla.nl/public_html/random/) [function.opendir]: failed to open dir: Operation not permitted in /usr/home/deb5485/domains/blabla.nl/public_html/website/wp-content/plugins/random-image-selector/randomImage.php on line 134
Warning: readdir(): supplied argument is not a valid Directory resource in /usr/home/deb5485/domains/blabla.nl/public_html/website/wp-content/plugins/random-image-selector/randomImage.php on line 136
It’s not the same error as Marisol was getting…
Hopefully you know what to do!
40 DXK // Oct 15, 2007 at 11:59 am
Never mind got it work
Full path fixed it !!!
41 kdmurray // Oct 15, 2007 at 11:26 pm
This will all become much clearer with the next release of the plugin (hopefully in a week or two). I’ve done a bit more digging and found how to pull that physical path automatically.
Just have one more niggling bug to work out with one of the new features. (I hope)
42 Henrik // Oct 24, 2007 at 5:24 am
How about adding the posibility to show a specific picture an aspecific day?
I would like to show pictures of my fiends that has there birthday that day.
43 kdmurray // Oct 24, 2007 at 10:26 am
@Henrik: That’s an interesting idea, but something that’s really beyond the scope of this particular plugin. Perhaps there’s another plugin in the Wordpress Codex more suited to this particular functionality…
44 shearyadi // Oct 29, 2007 at 1:40 am
I have try it with wp 2.31, the plugin is not working with the latest version?
45 kdmurray // Oct 29, 2007 at 9:43 pm
Hmm… not sure why it wouldn’t. I’m running 2.3.1 as well and as you can see in the site banner it’s working correctly…
46 Maarten // Nov 1, 2007 at 4:30 am
I having a problem with the code, could you help me?
I’ve put the code in my header, but there is no image showing. When I look in the code, there is a image, but it only uses the path of the folder where the images are stored, and not the image-file.
47 Jason Glover // Nov 2, 2007 at 1:52 am
Greetings,
What I am looking for is a plugin that will allow me to display ads in my sidebar. I am using cutline as well.
Basically I want to have a folder called ads with all my ads (all the same size).
Can I get this plug in to randomly display, say 5 ads out of perhaps 20 that are in the folder without replicating. Each ad would also have to have it’s own link.
Any ideas? If not this plug in than what?
I’ve tried some stuff hardcoding with javascript and it works, but sometimes replicates an ad, and it doesn’t pass validation.
48 kdmurray // Nov 2, 2007 at 9:09 am
@Maarten: I’ve sent you an email to get some more information from you.
@Jason: This plugin really isn’t suited to being an ad rotator, I was being kinda facetious. The biggest thing you’ll need with an ad rotator is a link associated with each image. This plugin doesn’t do that right now.
In searching the wordpress plugins site, I have to say I didn’t find a good ad-rotator plugin. Perhaps this will have to be my next project… maybe over the Christmas break.
49 Eudes // Nov 7, 2007 at 8:35 pm
Hi there!
Nice plugin, but I have a question…
Is it possible to insert the php code to show the random images inside an html?
ex.
my html…
i would replace the “XXXXXX” for the plugin code to show te image.
I did this but it does not work
and I am not pretty good at PHP ..:(
I am doind this because of the css and the alignment tags in the html….
welll any ideas?
a
thank you all alreay!
Eudes
50 kdmurray // Nov 7, 2007 at 11:58 pm
@Eudes: The HTML code got stripped out in your comment. I think I understand what you’re asking: Can this plugin be used outside of Wordpress to display random images on a page?
The answer is no, unfortunately this plugin is targeted solely at Wordpress and will not work in other PHP files or HTML files without very heavy modifications.
51 Chris Hajer // Nov 12, 2007 at 12:01 pm
Thanks for a great plugin. However my site fails to validate as XHTML 1.0 transitional due to the “title” being set for the img tag, rather than “alt”. The actual validation error I get:
Changing line 149 from title to alt takes care of the problem.
Thanks again for a great plugin.
52 Chris Hajer // Nov 12, 2007 at 12:19 pm
Also, I changed the code for the alt tag to make it a little more descriptive. Rather than an alt tag like “Camp-Mach-07″ (where the file extension only is stripped off) I convert the - and _ (if any are present) to spaces and then prepend “Picture of” to the alt tag. Here’s the new code:
`$make_space = array(”_”, “-”);
echo ”;`
Thanks once again for a great plugin.
53 finl // Nov 22, 2007 at 10:41 pm
BIG thanks for plugin! very usefull
54 Justin // Nov 29, 2007 at 8:24 pm
What do I do with the PHP script, I’m a n00b.
I want to put this on my wordpress blog to change the header but I have no idea what to do with the PHP script file.
55 Rafael Dourado // Dec 4, 2007 at 7:15 am
You could use ‘background-image’ instead of ‘background’. This way I could change some background properties like position.
56 kdmurray // Dec 6, 2007 at 9:25 am
I certainly could, Rafael. To be totally honest, I had forgotten that function was in there.
The code-change has been made for the next version, which I’m REALLY hoping to get out in the next week or two before I take some time off for Christmas.
57 Random Image Selector 1.2.0 Released | K's Weblog // Dec 9, 2007 at 1:20 am
[...] just put the finishing touches on the latest version of the Random Image Plugin that I originally released in the summer. This plugin will allow you to produce an <IMG> tag containing a randomly [...]
58 mac jordan // Apr 27, 2008 at 3:18 am
Thanks for this - I’m new to Wordpress and PHP, and it’s saved me a bunch of time!
http://www.photocena.com
59 Troy Dean // May 5, 2008 at 6:27 am
Hi K,
I’ve altered your plugin to make it xhtml valed by adding an alt attribute to the image tag output. So line 255 is now
echo ”;
Hope this all makes sense.
Cheers,
Troy.
60 Troy Dean // May 5, 2008 at 6:31 am
Hi K,
so I can’t upload the code for some reason but all I did to make your plugin valid was to duplicate the title attribute in the image tag output and make it an alt attribute on line 255
Cheers,
Troy.
61 jack23 // May 26, 2008 at 9:00 am
how the hell do you use this thing?
62 Keith Murray // May 26, 2008 at 10:29 pm
@jack23 have you read the readme that’s included? Is there a specific problem you’ve encountered?
63 Jeannie // Jun 11, 2008 at 11:41 am
Hello, Keith.
Thanks for this plugin. I’d really like to use it, but I can’t get it to work, because I’m sure I’m not doing something right.
1. I understand that the code needs to be dropped inside a php file, but which one? If I put the code inside a pages.php file or an index.php of my theme, it’ll affect every post/page. I’d like to just have the random image displayed in a single “Pages” post that I use as the homepage. Dropping the code directly inside that single post just creates text, even when I use the html editor of Wordpress’s text editor. And, I can’t access this particular single post from my host server site.
What am I missing?
Which exact file do I insert the code so that only one post displays the random images?
2. My images are arranged by months as subfolders underneath a main folder. If I point to the higher hierarchal folder, will all the images within the subfolders be accessed by the plugin or do I have to copy over the images into an all-inclusive folder that contains all the images in order for the plugin to see all the image files?
Thanks.
64 Keith Murray // Jun 12, 2008 at 6:39 pm
@Jeannie To drop the code in a single ‘Page’, you’d need to have a plugin installed which would permit you to put PHP code in your page or post. You can find a few different options in the wordpress.org plugins section.
Currently the plugin doesn’t support nested folder structures searching for image files. It is planned for the next major release, but with work and school I’m having difficulty finding the time to get it ready.
65 Jeannie // Jun 27, 2008 at 2:11 pm
Thanks very much, Keith. I’m trying a few things out and very much appreciate your help and having written this plugin.
Jeannie
66 Flo // Jul 14, 2008 at 2:06 am
hi,
you should add the “alt” tag to the image, and the height/width should be rounded up to full pixels, otherwise you get html/xhtml validation errors.
67 Keith Murray // Jul 17, 2008 at 12:18 am
@Flo thanks for the feedback. I’ll try to get this into one of the next releases.
68 dwigga // Jul 17, 2008 at 7:31 am
A greath plugin. I’ve installed and it works, but it seems it dosnt work with the theme Im using. It dosnt positioning the header image where it has to.
69 LinuxSoftware » Banner Images // Jul 25, 2008 at 3:41 pm
[...] used to use the Random Image Selector by Keith Murray to display the banner, since then I’ve coded it into my WordPress and [...]
70 Flo // Jul 28, 2008 at 2:41 am
@Keith Murray
since I needed it already (the round number thing), I did it myself. i.e. I changed
$physWidth = $physWidth / $ratio;
to
$physWidth = round($physWidth / $ratio);
71 mardie // Aug 14, 2008 at 9:45 pm
questions:
1. When it a page opens in a new window is it refreshed? i mean the image would change?
I would like something like this however.
2. What if i want to rotate images from a list of URL sources (e.g. “list.txt”)? coz most of our images/banners are outside source.
My idea is:
On that list file, you could also add some title, URL to be displayed, so that you can in your index page you could call the specific title, URL for an image. I guess database tables is need for this kind of coding, to store and retrieve info for a specific image.
I hope you understand me.
I would be keeping an eye for your plugin for more updates. =)
72 Kelly // Sep 14, 2008 at 7:29 am
Leave a Comment