The Upward Path

your message matters

tools

How to get nice spacing round images in WordPress

By

When you add images to a post or page using ‘Add Media’, WordPress jams them pretty tight up to the text.

image spacing graphicYou can tell it to align the image left, right or centre, but you can’t control the spacing. You can see how that ends up in the image opposite.

I don’t like that as a piece of visual design, and it’s not the best experience for the reader.

So I’ve adopted a standard operating procedure of setting the spacing manually for each image. Read on to find out how.

Quick notes

Note 1. If you’re comfortable with the idea of going into the files for your theme and altering stylesheets, you can set your own default options for WordPress to use. (Info here if that’s you.) But for most people that’s too hard to work out, and there’s a risk of messing things up. I’ve never been motivated to do it myself.

Note 2. Do try it the standard way without fiddling first, especially if you’re using a purchased theme. It may be that the folks who designed your theme have improved the standard spacing.

Note 3. If you want a text caption displayed with your image, eg for a photo, you might find this technique makes it go a bit weird and it’s easier to rely on default formatting.

Putting on the style

First, add your image via ‘Add Media’ and get it in basically the right place. Then we’ll tweak it so it ends up like the version here, which I hope you can see has more breathing space.

image spacing graphicIn the window where you write your post or page, there are two tabs at the top right: ‘Visual’ and ‘Text’. You’ve probably been working in Visual, which shows an approximation of what the page will look like. For this we need to go into Text.

Text mode shows you the guts of your page. Most of it is the text you’ve typed, but you’ll also see formatting instructions in <angle brackets>. Those are a blend of HTML, which tells the reader’s browser software what things go where, and CSS, which tells it the styles to use when it displays those things – size, colour, alignment and so on.   [Read more…] about How to get nice spacing round images in WordPress

How to make great word graphics for social media sharing

By

Word graphics image

Images like the one above are a great way to share little pieces of your message. If you get them right.

You can spread them on social media. They’re like message sweeties that people can share with their own contacts. Images like these are also good for putting in web pages, to show up when people share that page. (And you can’t share a page on Pinterest if it has no images.)

The point of these ‘word graphics’ is to be visually attractive, with a message the reader can take in quickly. Then they can have a smile, or a pause and think, and then carry on with their day. You might even change someone’s life, if they’re in the right place for your message to go in deeply.

A lot of us have discovered tools that make it easy to create these graphics: choosing from a selection of backgrounds and text styles and outputting the final image, without having to use full-blown graphics software. I use an iOS app called Wordswag that someone introduced me to. There are lots of other apps too. Some people use Canva, an online design tool.

But just because it’s easy doesn’t mean the software will automatically make good graphics. That’s down to you.

Remember: attractive, and easy to absorb. If the reader’s brain decides that processing your text will be too much like hard work – or if it threatens to hurt their eyes! – they’ll move on to the next thing and never absorb your little nugget of wisdom.

So here are some tips.   [Read more…] about How to make great word graphics for social media sharing