K's Weblog

Technology and the Interweb for the Real World

WordPress Plugin: Random Image Selector

July 25th, 2007 by Keith

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.

  1. Extract randomImage.php into your wp-content/plugins folder (or a subfolder)
  2. Activate the plugin in WordPress
  3. On the options screen, select the “Random Image” menu
  4. Fill in the values for your physical and http paths
  5. 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.

Tags:   · · · 76 Comments

Leave a Comment

Comments links could be nofollow free.

76 responses so far ↓

  • 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:

    …ines-03.jpg” title=”White-Pines-03″ />

    The attribute given above is required for an element that you’ve used, but you have omitted it. For instance, in most HTML and XHTML document types the “type” attribute is required on the “script” element and the “alt” attribute is required for the “img” element.

    Typical values for type are type=”text/css” for [style] and type=”text/javascript” for [script].

    Changing line 149 from title to alt takes care of the problem.

    Thanks again for a great plugin.

  • 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.

  • BIG thanks for plugin! very usefull :razz:

  • 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.

  • You could use ‘background-image’ instead of ‘background’. This way I could change some background properties like position.

  • 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.

  • [...] 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 [...]

  • Thanks for this – I’m new to WordPress and PHP, and it’s saved me a bunch of time!

    http://www.photocena.com

  • 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.

  • 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.

  • how the hell do you use this thing?

  • @jack23 have you read the readme that’s included? Is there a specific problem you’ve encountered?

  • 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.

  • @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.

  • Thanks very much, Keith. I’m trying a few things out and very much appreciate your help and having written this plugin.

    Jeannie

  • 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.

  • @Flo thanks for the feedback. I’ll try to get this into one of the next releases.

  • 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.

  • [...] used to use the Random Image Selector by Keith Murray to display the banner, since then I’ve coded it into my WordPress and [...]

  • @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);

  • 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. =)

  • :mrgreen: I figured it out… I added <img style=”padding : 0px 10px opx opx; to randomimage.php.

  • The plugin is great. It works with my Cebu Car Finder site here http://cars.cebulive.com/

  • I’ve definitely come across this plugin on the WP site before. Good work!

  • Hey, nice plugin, thnx.
    I need this random function but I need the bg to repeat in both axis. Is there a way to do this editing the current version code?
    thnx again.

  • ok so i downloaded and activated… created a folder for my images… but i’m not really sure about the path to my folder… yup im a dolt…. help?