Quick Tip: Add Dynamic Images to Your WordPress Blog

Any blogger worth their salt knows how important images are to a successful website design.

After writing quality content, the visual aids you use are the second most important tool for engaging your readers.

Most successful site designs make use of photos and graphics – check out the WordPress Showcase for some amazing examples.

The problem is that a website image, like a loaf of bread, is a perishable item. It goes stale with time.

Dynamic images on your WordPress blog
The yawn of death - is this your site visitor?

If you’re displaying the same static images on your site – day in, day out – soon enough your visitors will grow weary of them, now matter how pretty they are. And when your site gets boring, your traffic starts to drop.

Featured Plugin - WordPress Google Maps Plugin

Simply insert google maps into posts, sidebars and pages - show directions, streetview, provide image overlays and do it all from a simple button and comprehensive widget.
Find out more

Dynamic trumps static

Rotate your images on WordPressRather than displaying a single image all the time, you can get a much greater shelf-life from your photos and graphics by rotating them. Anywhere you display an image on your site, it’s fairly simple to set up a rotator that will display a different image every time the page reloads.

Do this, and your readers will be treated to a slightly different visual experience every time they visit your site.

Dynamic images can add a bit of spice to your design, and help create the impression that your website offers something fresh and unique for every visitor.

Rotating header images, for example, are used widely in the WordPress community. You can see a dynamic header in action on the default Twenty-Eleven theme that comes with a new installation of WordPress.

When I arrive on my test blog’s homepage, this is the header image I’m greeted with.

Use a rotating header image in WordPress

Then I hit refresh, and when the page reloads it looks like this:

Add rotating images to your WordPress header

Pretty nifty, huh?

To be sure, if your content is boring and repetitive, no amount of flashy design will mask that fact and your blog will perish.

But if your content is solid and you’re offering something of value to the reader, then a few subtle visual tweaks can really kick your site up a gear. Using a rotation of dynamic images is an easy way to keep your site design fresh without having to change anything manually.

Featured Plugin - WordPress Facebook Plugin

Would you like to add Facebook comments, registration, 'Like' buttons and autoposting to your WP site? Well, The Ultimate Facebook plugin has got that all covered!
Find out more

Make it happen

Advanced WordPress users who are comfortable with PHP can add dynamic images to their site with a number of different scripts.

For non-coders in search of a quick and painless solution, it’s time for a trip to the WordPress Plugin Directory. There’s an ample selection of plugins that allow you to display dynamic images on your WordPress site. Far more than we could list by name here, but to get started you could check out Image Rotator, Dynamic Headers or WP Rotator.

Whichever plugin you use, you will need to choose your selection of dynamic images and upload them to a specified folder on your server, where the plugin can find them. Keep the following points in mind when doing this:

  • All images need to have the same pixel dimensions, eg. 500 x 350
  • Use the same file extension for all your images. Don’t upload a mixture of JPEG, GIF, PNG etc.
  • Don’t use excessively large image files on your website, as this will affect your page loading times. Resize your images for optimal web use. (More on that here).

If you’re not married to your current blog design, you could also consider changing your WordPress theme to one that accomodates dynamic images out of the box.

Over to you. Got any tips on incorporating dynamic images into a WordPress site?

Thanks to Bike Racer and Grevel for the photos.

Comments (3)

Participate