The Basics Of How To Style A Wordpress Post

- Image via Wikipedia
Now that you’ve gotten your blog up and running you’re probably already writing posts but some unusual anomalies have crept into your work. You’ve perhaps wondered why your text is not wrapping around your images? Or perhaps you find that you have oodles of whitespace to the right of your posts because your post text is not justified? Maybe you’re wondering why no-one is coming to your posts? Perhaps it’s due to the irrelevant title? Here’s a short list of ways you can style your Wordpress posts to address the most basic issues every blogger runs across when just starting out.
• Blog Posts Need Relevant Titles – Make sure your title is relevant to the post you’ve written or no-one will ever find it. So let’s say you wrote a fantastic article about “home stereo systems” then you should try to pull a relevant title from what you’ve written. For example, you’ve written a comparison guide for “home stereo systems” that includes features and prices, then a great title for your post could be “Features and Price Guide For Home Stereo System Buffs”. You might be saying to yourself, “Well isn’t it obvious that my post is about features and prices for home stereo systems?” and “What kind of moron would incorrectly title their blog post anyways?” Well, some posts you write will have a very clear and concise direction while others will be more like unfocused rants or just thoughts you’ve had about a certain subject and the title may not be so easy to come up with then. If the latter is the case, then trying to find the focus of an unfocused post can be somewhat challenging and it happens to us all. Take a moment and consider the subject matter of your post before coming up an irrelevant title and check out Copyblogger for some great tips on writing your best post titles.
• Post Images Need Relevant Titles – The way to title an image is there in the display window that comes up after you’ve uploaded the image. The default photo title will be the what the camera gave it or the name of the file you downloaded from the Internet. You will need to change it to something relevant to the photo if you want folks to find it. As an example, if you took a photo of a beautiful sunrise your camera has probably titled your photo something like “img1101.jpg”. You need to change the title in the image title field to read something like “beautiful sunrise”. After all, which do you think folks will search for on the Internet? Photos named “img1101″ or photos of “beautfiul sunrises”…it’s up to you…
• Wrap Text Around Wordpress Images – To make sure your text wraps nicely around your post photos…always set the photo alignment to left, right or center. You can do this from the display window that pops open after you’ve uploaded your image. If you find that even after setting the alignment your text is still now wrapping around the image, that’s because Wordpress changed the default image classes not too long ago and probably the template you’re using still uses the old image classes in the stylesheet. Add these codes to the style.css of the theme you are using:
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
• Always Use The HTML Editor Tab When Inserting Any Sort of HTML Codes Into Your Posts. – Why? Because the visual editor tab inside Wordpress will not convert your html codes to what you wanted it to do. Instead, your html codes will appear in your post exactly the way you inserted them using the visual editor. Switch to the html editor tab, insert your code, then switch back to the visual editor. Your post html should look like what you had intended and not the raw codes.
• Set The Alignment Of Your Post Text – You can align your post text left, right, or justified. Justified gives you the same amount of whitespace in between each left and right margin. You can do this two ways…the first way is to wrap your post writing in this source code < p style=”text-align: justify;” > or align it left or right, from inside the Wordpress post editor each and every time you write a post. Or you can fix this globally by adding:
text-align: left;
text-align: right;
text-align: justify;
to your style.css file at to automatically align text such as on page paragraphs and post paragraphs.
• Clear The Float Of Images You Add To Your Posts – If it ever happens (and it will) that you have an image that is longer than the text you want to put next to it, when you want to start a new paragraph the image will hang down over your next block of text. Your next paragraph or image will by default try to line up underneath the last block of text even if it throws off your entire post layout. Here’s how to fix this:
Enter this source code <div style=”clear:both;”></div> after your last paragraph (with the image) in the Wordpress editor and before the next text paragraph or image. This code will force your next paragraph to start below the last image length instead of the length of the short text you wrote beside it.
This is not an exhaustive list of how to style a Wordpress post, but it is an outline of the basic quirks that you will be sure to run into pretty much as soon as you write your first post…so keep this list handy as a reference and happy blogging.
![Reblog this post [with Zemanta]](http://img.zemanta.com/reblog_e.png?x-id=875453d7-5317-4806-b698-293659d7f223)


Thanks for the post I’ve been looking for a way to justify my post on wordpress. Great post