Make WordPress Content Images Look Great

After a site launches, and clients get familiar with using their new WordPress site to publish content, I’ll occasionally pay their sites a visit to see how they’re doing.

Formatting could be better...When I look at their blog posts (which I’m happy to see, since blogging is such a great way to promote a business website) far too often I’ll often see something that just doesn’t look very good.

See the images just stuck on the page, with no relationship to the text content around them? So lonely… but it doesn’t have to be that way. I’m going to show you three easy ways to make your images look like a pro added them (and after a bit of practice, you’ll be that pro).

1. Getting Images Into the Flow

WordPress makes it simple to add images but often you might not know what settings to use. Images that are included in the flow of your text, with text wrapping around them like you’d see in a newspaper or magazine article, looks much nicer than an isolated image hanging out by itself.

See the difference here? The right example has a much more pro look:

Aligning imagesSo how do you wrap text around your images?

Open up one of your pages or blog posts that has an image in the WordPress editor. Click on it and you’ll see this little edit menu pop up (see example to the right).

Right there, you can choose how to align your image: text on the right, image in the center, text on the left (which is selected in the example), or no alignment. If your images are small enough to fit into the flow, try text on the right or text on the left and see what a difference that makes in the readability of your post or page.

This is not  a hard and fast rule – sometimes you do want to isolate an image away from text. But just keep it in mind when you’re writing your next post.

2. Use Image Zoom Only When Necessary

Image zooms in the form of lightboxes are a handy tool for when you have a large image you want to show readers but don’t have room to put it in your text content.  FancyBox is a very popular lightbox and there are many WordPress plugins to get FancyBox working in your site (this is the one I use).

Choosing image sizeHow do lightboxes work?

When you add an image to a page or post you get to pick what size you want to use. If the image is pretty big, you’ll usually pick Medium or Large (the sizes may be different in your theme, but it works the same way). See the example to the right where I’ve picked Medium.

Then your lightbox comes into play. See where it says “Link to” and “Media File”? When you’re using a lightbox plugin that means that clicking on the image will open the media file. If you were not using a lightbox plugin it would just open your image in a separate page, which doesn’t look so good. And we’ve all seen that.

So here is a large image below this text, I’ve added it as size Medium (and yes I know it’s stuck there in the page by itself, but this is just an example). Try clicking on it and you’ll see the lightbox or image zoom effect in action.

This is a large image that can benefit from zooming.

This way you can provide a bit of fun interactivity to your readers and give them a glorious full-size image even when it won’t normally fit in your page. Win-win.

But do you always need to use the lightbox effect? The answer is most definitely no. Try this example below and you’ll see what I mean.

This image is too small to need zooming.

This photo is small – it’s inserted at Full Size. There’s no need to zoom, no reason to make the reader think they’re going to get something different when they click. It’s not necessary.

link-to-mediaHow do you remove the lightbox effect? It’s easy. In the WordPress editor, click your image to pull up the little edit menu. Then click the pencil to get to the other editing options.

See where it says “Link to” and “Media File?” Just change Media File to None, save your change, update the page or post and now your image doesn’t do anything on click. Which is just fine, because it doesn’t need to.

3. Use Captions When They Help the Reader

Is your photo or image totally self-explanatory? Or would the reader benefit from getting a bit more information about the subject matter? If the answer is yes, add a caption to your image.

Here’s how to do it: in the WordPress editor click an image, then click the little pencil to get to the other editing options. In the Caption box, add your caption (it’s incredibly easy). And you should also have some text in the Alternative Text box for those who may not be able to see your image.

This is about making captions

Photo of a female climber
This is an example of a caption.

How your caption actually appears in the post depends on the styling set up in your theme, it could vary a lot. There are even plugins that let you customize caption styling without knowing code:

In any case, if the reader needs more information to understand what your image is about, add a caption. It only takes a few seconds and can have a positive effect on the readability of your post.

Summing Up

Making your WordPress content images look great is easy, it’s a matter of choosing the right image size; deciding how to align it within the flow of content; deciding whether the reader needs to be able to zoom in and see more, and and determining if a caption is needed. Doing these things will make your blog posts more attractive and more useful for your readers.