Randomize Those Header Images

Posted on by Alan Levine

The Trick, Said Quick

Most WordPress themes make use of an image at the top of the site (header image) that is easily set in the Customizer. But why limit yourself to one image when you can make them random on different pages?

The Trick, In Intricate

Not all themes make use of Header Images, but most do. And if anything can make a blog more dynamic, it’s a bit of visual random magic.

The first thing to do is (after logging into your site) click Customize in the black admin bar if you are viewing your site. Or if you are in the Dashboard, Select Customize from under the Appearance menu.

There’s much more to the Customizer worth exploring here, but a huge advantage over making changes in the dashboard is you can preview the way it looks as you try new settings. And if you mess things up, just exit without publishing.

From the left side in the customizer, open the pane for Header Image (if you do not see one, then the theme does not use one, so this trick is pointless).

Anyhow, if you do have one, you can upload an image to use- it’s best if the image is large; you will be asked to crop it to fit the size allowed by the theme.

Here is the Customizer for my own page at http://cog.dog which uses a theme I build called WP-Dimension; it uses the Header Image for the background image.

WordPress Customizer opened to the Header Image pane, showing selection of a dog’s head and how it appears on the site on the right.

And you can stop there, with one header image. But if you want some variety, add a few more Header Images. Scroll to the bottom of the list of Header Images, and click the button for Randomize Header Images. Publish your changes.

Now, every page on your site that uses the Header Image will have a randomly selected header image (it might be just the home page or it might be them all, depending on the theme).

Every reload of https://cog.dog/ gets a new dog.

Ahh, once you go random, there’s no return.

The Trick, Done Slick

  • The Virtually Connecting site (using the MH Magazine Lite theme) has more of a blog header style image, full page width but not very tall. It has almost 50 random header images!
  • My Best in Show site (uses the Hitchcock theme) uses a few different header images that show up in the background of the title. I should add more!

The Trick, Give it a Kick

Tweet back a reply with an example you tried and/or how might you use this?

Featured dog trick image by Karsten Paulick from Pixabay