10 March 2014


Aligning your blog photos to your post text. Having a streamlined blog body has always been something that I've struggled to achieve. I fussed around with different html codes and blog templates, but nothing worked. The slight misalignment of my blog posts really bothered me, and I honestly lost some sleep over it. I probably should've just asked one of my blog design lovelies, but I wanted to figure it out for myself. And I did! And boy, it was super simple - one of those smack your face on the table over and over again, because it was right there in front of you kind of things... yeah. I probably did that, lol. So here it is, for anyone else who is as lost as I was. I hope this helps you out. 

How to go from this unaligned blog post: You can see that the photo is slightly indented at the left and slightly extended beyond the edge of the text. Not streamlined.

To a streamlined blog post: The text and photo start and end at the same place. Yes!

The first thing you want to do is type out the text for your post and put all the photos in. Then you want to Justify the entire body of the post (text and photos - you'll alter each photo alignment later). NOTE: Be sure not to highlight your signature at the end - usually that is centered. It's important to align text first and photos last, because Blogger is a little silly and likes to play these games where it makes everything harder for us. Ok, here we go!

How to Justify (align text to block format): (the justify alignment option is highlighted in blue - select your text and click the last alignment option)

How to align photos:
Upload a photo that's at least as wide as your blog body (where the post goes). I stick to 2000 pixels wide for all my photos, just to be safe. It's always better to have a too large photo than a too small one. When you first upload a photo, it will look like this, too small and most definitely not aligned to the edges of the post:

Then, you want to click the photo and the options will pop up. Select X-Large. Click the photo again, and select Left. This will align the photo to the rest of your blog text. It won't look like it in the editing screen, but if you save and preview, the photo should be aligned to the rest of the blog post text. 

So that's it. I've spent so much time trying to figure this out, so I hope that it helps someone else. Happy blogging! :)

Connect with me!

No comments:

Post a Comment

Thank you so much for commenting! I try to respond to all comments, but you can tweet me too for faster communication :). I love talking to you all!

Related Posts Plugin for WordPress, Blogger...