I was recently asked how I wrap text around my pictures and because I also see this question pop up from time to time I decided to write a tutorial post about it.
Wrapping text around pictures is an easy way to make your page or post look a little different than the normal picture posts. While it is an easy process it can sometimes be a little tricky to get the words to line up correctly so it might require some patience while you finagle your photo.
There are a few ways that you can tackle this effect but for the purpose of this tutorial I am going to be writing most my text first and then adding the pictures in afterwards. The picture(s) can also be added as you are writing, but I find it a little easier to add them in at the end.
Before I get into a step by step I just wanted to address a few things so you’ll have a good understanding of what I am talking about.
The first thing worth mentioning is that you’ll want to have enough words in your post to make the text look full enough. When I say “full enough” I mean that you have enough words to actually wrap around the text instead of your words ending and then having the picture overhang. This usually isn’t a problem if you are only using one picture but can be trouble if you are using more than a couple of pictures and don’t really have a lot of written content.
The second thing I want to mention is the toolbar that we will be using to format your text and picture option. This toolbar is accessed by clicking on the photo once you’ve added into your editor. Immediately after selecting media to add you are given a few options of what you can do with your photo but there are more options that don’t show up on that screen. Once you have selected and added your picture to your post you can make even more changes to it by clicking the photo in your editor. When you click on the picture in your post from the editor page, little symbols on a menu will pop up. These are the options that allow you to format your picture, including the way your text behaves around the photo.
This is the toolbar we will be using to nest your photos and it offers a variety of options:
- The first symbol (left) will allow the photo nestle in the photo like the first paragraph.
- The second symbol from the left will allow text at the top of the picture as well as the bottom, and is the most commonly used format.
- The third symbol from the left will move your picture to the right of the text and allow your words to wrap around it like my first paragraphs example but reversed.
*Note: These left and right wrap photos are a little tricky to align and might need a little practice. Sometimes it is hard to get the photo exactly where you want it, I don’t know why.
If your photo doesn’t end up exactly where you’d like it once you insert it into the post you can “grab” the photo and move it back into your text. To do this click the picture but don’t let go. Using the mouse drag the picture further up (or down) the paragraph.
This is the part where you need patience but it can be done! Just keep trying :)
- The fourth symbol that in the pop up allows you to add the photo anywhere you want it but it it won’t nestle in your text. I admit that I have never used this option and don’t know how it could be used effectively, maybe someone else who is reading this does know and can offer information.
- The last symbol you will see from clicking on the media you’ve added to your post is a really important one. The pencil symbol controls a few things about the photo and you really should get to know this button. With this button you can:
- change the size of your photos* — ranging from thumbnail to custom sizes
- add a title to your photo which is great for SEO if you are trying to improve
- the file name can be changed, great for SEO and organizing
- borders can be added
- the way the photo will appear when readers click on it, a separate page or just larger
Now that we have that out of the way, here is a step by step of what to do:
- write your post
- click the add media button and select your picture
- click on the picture the shows in the editor
- select one of the symbols for your alignment options
- drag your photo to where you would like it to be located
- preview your work
- repeat until all photos are entered and you are satisfied
*note: If your photo is too large or small and doesn’t look correct in your text once you’ve moved it into place it can be resized by using the last (pencil) symbol.
I hope that this was easy to understand and that you will be able to use this option when it comes to changing the way your posts look. Please let me know if you have any questions about this post and I will try to clarify better. Also, if you have any other questions on how to do something, as always I’d love to help, just let me know!