Multiple 'random header' images for different pages

Home Forums Theme Stuff Multiple 'random header' images for different pages

This topic contains 23 replies, has 2 voices, and was last updated by  Rev. Voodoo 5 years, 6 months ago.

Viewing 15 posts - 1 through 15 (of 24 total)
  • Author
  • #1265


    Hey Rev!

    Firstly, I’d just like to congratulate you on this project. I’m just starting out in the world of WordPress, Themes, CSS and PHP. My main job is as an IT administrator for a school in Thailand, but I’m doing alot of work for the school as well as side projects for friends and hopefully a bit of extra cash in the future.

    Anyway, I’m working on a site where the owner wants to have random ‘Hero’ images at the top of the page, but when you select certain pages it will rotate through different images.

    So there will be a general ‘random_header’ for most of the pages, then a header for ‘random_phuket_header’; ‘random_samui_header’ and ‘random_pattaya_header’.

    I guess I’ve got to make different functions for this in my child functions.php and then make an if then else statement or similar (sorry, my coding experience really only stretches to making unix and shell scripts and writing Java applets in the late 90s).

    Any help on this would be appreciated – keep up the good work!




    Rev. Voodoo

    So, I’m trying to approach this as simply as possible…. which leads me to this rotation script from

    Random Image Script

    On first glance, I would think that everything could be used as is…. I just think we would need to conditionalize the path.
    So for instance if page 1, path to folder 1, if page 2, path to folder 2, else, … path is blank… so it looks in the current directory for images to display….



    Thanks Rev!

    I’ll take a look at this over the next day or so and see what I can make of it.

    I was going to start using the conditional arguments of ‘is_page’ from the wordpress codex and go from there. So I think it was going to be ‘if is_samui’ then load ‘samui_header’ array function, elseif ‘is_phuket’ then load ‘phuket_header’ array function, elseif ‘is_pattaya’ then load ‘pattaya_header’ function else load ‘mychildtheme_header’ function.

    But, the way you’ve pointed me to looks like a much simpler way of doing things and would improve page loading times!

    I’m too tired to work on it now, but that’s been a great help Rev.

    I’ll keep you updated on how I’m getting on





    OK, so I haven’t tried anything yet, but I’m thinking I better explain a bit more about what I want to achieve.

    So we have a random image header selection (for which I used your code to get working – thanks very much for that) but what I’d like to do is have the child pages for each section show the same random images.

    So, page ‘Phuket’ has 2 child images, ‘About Phuket’ and ‘Properties for Sale in Phuket’.

    Therefore I was thinking of using the conditional statement of ‘is_page’ piping in different conditions?

    So in the case of the code provided by I would use:

    $folder = ‘ ‘;
    $exts = ‘jpg jpeg png gif’;
    $files = array(); $i = -1; // Initialize some variables
    if ( is_page (‘Phuket’) || is_page (‘About Phuket’) || is_page (‘Properties for Sale in Phuket’)) $folder = ‘./images/headers/phuket/’;
    else (‘ ‘ == $folder) $folder = ‘./images/headers’;

    Do you think something like that would work with the rest of the code as Matt set out?

    I’m not sure – I’m pretty sure I’m missing something – the first ‘$folder = ‘ ” confuses me, would I be declaring a folder path here? The comments say to leave it blank if using the current folder, but then I declare the location for the images later on with my conditional tags?

    I’m pretty sure this is the best way to go because it’s really simple and should be fairly fast.

    Sorry to pick your brains like this – I really appreciate it Rev.





    Oh, and not to forget that I’d need another 2 ‘if’ statements for ‘if Pattaya’ and ‘if Samui’ then the else – everything else.

    My brain feels fried by this right now, not helped by my complete lack of understanding of the layout for php!

    Thanks again



    OK – I had a cup of tea and a think on it – so I’ve saved a copy of my working functions.php to my computer, now I’ve tried the code from as it was and it white screened the site.

    So I added in the following into the existing framework:

    if (is_page (‘koh-samui’) == $folder) $folder= ‘./images/headers/samui/’

    But all this does is reference everything on each page to the subfolders of that site which obviously don’t exist.

    So I was thinking – do I need to use the get_stylesheet_directory() function to reference everything back or do I need to give an absolute path at the beginning? I don’t like absolute paths as it means as soon as I change any folders or locations of things to tidy up it’s all going to break.

    What do you think Rev.?




    Hmm, I’m getting very close, I used the following line:

    if (is_page (‘koh-samui’) == $folder) $folder= get_stylesheet_directory() . ‘/images/headers/samui/’;

    And it’s returning a very long url with the correct url for one of the samui images at the end of it – but obviously totally wrong for the site to work.

    With this code – do I need to define everything else like you did in your original random header image code? I thought the code at the end made sure the images returned from the function were used as the header images?

    As usual, I’m pretty sure the problem lies in something I’m doing wrong!






    I’ve been playing about with it and have been thinking about what I’m doing wrong.

    So, some more basic questions now:

    1) Should I be wrapping the code up as a function – so declare the function name at the beginning and then call it at the end?
    2) I’m confused about where I should be putting the if statements for the page locations – should this be at the beginning or in the middle of the code.

    I’m sorry, I swear I’m getting dumber by the second!

    If you can help I’d appreciate it





    Oh! I’ve just read on another article about this code – do I stick this code into the same folder as the images and then name it as a php script, then call up that script from the css?



    OMG – I’m so quick to try the code out I never looked at the installation instructions.

    Hmm, so I would conditionalise the images that are outputted from within the rotator php script and then call it from the child style.css.

    Cool – I’ll have a crack at that tonight!

    Thanks again,



    Rev. Voodoo

    I’ve just got back to my computer after a nice weekend. It looks like you are on the right track! I don’t have time right now to install this and experiment, but I think you are definitely getting there!



    Thanks Rev. – I’m going to give it another go tonight to see if I can get it working.

    I’ve plugged the code straight in and it works when sticking an image onto a page – but I’m now trying to work out where I can stick the rotating image code in place of the header image.





    Well, I’ve tried adding the conditional statements into the header.php and I can’t get it to work.

    I was also thinking about making multiple rotator.php (rotatorsamui.php, rotatorpattaya.php etc.) but I don’t think this is very elegant. So now I’m looking at doing it within the rotator.php in the one folder and working it from there. This would be great as it means I use one code, job done. Having said that, if I did that, where do I insert the ‘rotator.php’ url for the image? Is that within the style.css or within the header.php?

    Hmm, I’m still confused over this!




    Rev. Voodoo

    OK, so here’s what I was thinking on first glance….
    First up, we plop the script into a folder in your theme. For simplicity, I’ll call it rotate.
    Then we have to call to the script from your header.

    img src=”? php echo get_stylesheet_directory_uri(); ?>/rotate/rotate.php” alt=”A Random Image” />
    (I had to leave out some opening brackets before the img and php there to keep the forum from eating the code)
    So that includes your script. Now, in this situation, I’d say if you have any general headers…. ones you want to rotate through that aren’t assigned to any particular pages, put them into the rotate folder with the rotate.php script.

    As for the pics you want t assign to specific pages, put them into their own folders, inside of the rotate folder like:
    rotate -> koh-samui -> images
    rotate -> phuket -> images

    Thats’s the call to the script, and the image sorting. Just gotta adjust the rotator script.

    // Make this the relative path to the images, like "../img" or "random/images/".
    // If the images are in the same directory, leave it blank.
    if ( is_page( 'phuket' ) ) {
    	$folder = 'phuket/';
    } elseif ( is_page( 'kohsamui' ) ) {
    	$folder = 'kohsamui/';
    } else {
    	$folder = '';

    Is how I would think we could conditionalize around each page, I think. I would hope wordpress conditionals would still work inside of the included rotator file. You can copy the little elseif block over and over to include more pages.

    I just realized as I was typing that, a couple of my friends just got back from a long vacation in Koh-samui….



    Hey Rev.

    So when I call the rotating image from the header.php, would I just reference it in standard html and remove anything else? I’m guessing I will make a ‘child’ header.php that is empty except for that code there? Hmmm, maybe I should stop asking so many questions and experiment more!

    Hey – Koh Samui – I may have passed them when riding around the island on my Honda Dream! It’s worth a visit some time if you are ever in this part of the world – you’ve got some beautiful islands nearby which are less ‘commercial’ than this island. I spend some of my spare time with my girlfriend trying to find more remote beaches on the island, especially in the southern part that hasn’t been taken up so much by big hotels and resort companies.

    I’ll report back later with my progress – thanks mate!


Viewing 15 posts - 1 through 15 (of 24 total)

You must be logged in to reply to this topic.