3 Easy CSS Tweaks To Perfect Your Blog Theme
Everybody’s idea of the perfect WordPress theme is slightly different and if you are trying to do this with a free theme it seems there are always tradeoffs to take into account.
3 of the easier fixes can be done from the styles.css file on most themes.
- Fonts
- Backgrounds
- Header
So if you find the almost perfect WordPress theme and you want to make it your own here are some simple fixes for you. (Caution: Always, always, always make a backup of your files before editing them. ALWAYS. Got that? Yes always 
)
Now that the disclaimer is done lets look at how I can change the font for my theme. I will use the main content area in this example but you can do it for the sidebar or even the header in the same manner.
You can change the font size by finding the place where it is set.
In this case it is 12 px which is fine but if it were 8 or 10 px they can be hard to read and you might want to change it. Anytime you do change the font size you will want to see what the line spacing size is. If I had changed that from 12 px to 16px I would probably want to change the line space accordingly or the text will take up all of the space.
As on this theme it is only 18 px and the lines would have very little white space which would still leave the blog hard to read.
Changing backgrounds is easy too especially if it is a solid color. You will need the hexadecimal color code for the new color.
If it is solid you only need to change the code and the background color will change. If it is an image you will need to upload the new image and you can either overwrite the image with the same name with your new image (not recommended and grab a copy of the original first in a safe place) or upload the new image with a different name and edit the css file.
Changing the header is the same as changing a background image. Add the new image in the same manner and edit the css file.
Now you know how to tweak the css to take your almost perfect theme and bring it closer to perfection. (There is no perfect blog theme though we all keep striving for it and if you find one you will change your mind and grow bored with it eventually.)
About the author
|
Mike Paetzold got started blogging in 2003 and has become an expert on using WordPress. He has become known as The WordPress Guy. After being an under ground niche marketer using his blogs he has surfaced to share some of the ways he uses blogs to enter various niches profitably. Get the details at Profitable Blog Steps |
Related posts
Like this post? Subscribe to my RSS feed and get loads more!
Disclaimer: Some of the links mentioned within this post or posts it may lead to are my affiliate links and in such case I will get compensated for recommending those products. However, I will never recommend something that I don’t personally believe in and I welcome your questions and feedback.
9 comments
Luca Di Nicola
Twitter: rsonline
on September 17, 2009 at 2:38 pm
I’ve always wanted to learn how to tweak my themes especially the font size. You make it look reaaly easy. What file do we back up – is t the style.css file within the Theme folder? Also is there a rule of thumb about how much to increase or decrease the line height in relation to the font size change?
Thanks for the tips.
Luca Di Nicola´s last blog ..Top 10 things to do with the Abundance Stimulus PLR Pack
[Reply]
Mike
Twitter: thewpmaven
Reply:
September 17th, 2009 at 2:45 pm
I usually increase it the same as the increase in font size IF…
I liked the white space that was already there.
[Reply]
Joel Osborne
Twitter: JoelOsborne
on September 17, 2009 at 2:59 pm
Very cool tips! I haven’t been able to master CSS coding yet, but I can change simple things like you mentioned, which I think everyone should learn how to do. Small changes can make your blog really stand out.
Joel Osborne´s last blog ..The Abundance Stimulus Pack
[Reply]
Earl Netwal
Twitter: EarlNetwal
on September 17, 2009 at 4:26 pm
Yes, I too consider the CSS stuff to be challenging. I’ve learned a few steps, and tomorrow I hope to learn a few more. Thanks. I remember learning just a few HTML things and then a few more. And while I am far from competent, little by little I’ve learned how to do more and more things myself and thats a good feeling. Appreciate the tips.
Earl Netwal´s last blog ..Content Generation Tool
[Reply]
rosie on September 17, 2009 at 8:27 pm
This is a great post. I find that learning more about CSS can be critical for customizing a free theme. It also gives you more control.
Your simple and clear explanation was very good. I did not know about changing the line space along with the font size. Thanks
rosie´s last blog ..Google Goodie #5 -Advertising to Baby Boomers PowerPoint
[Reply]
Lonnie Minton on September 18, 2009 at 2:41 pm
Thanks for these three tips. I agree with Luca. The one on font size was really useful. Some blogs are hard to read, for me, and I have wondered how I could increase the font size for others.
Lonnie Minton´s last blog ..Stop Promoting Uninteresting Products
[Reply]
Andre Arnett on September 18, 2009 at 7:00 pm
That is something I have never really tackled because it looked so hard. Probably still is but you have laid out a pretty clear explanation. Will back up my files before I attempt but will still be hollering H-E-L-P!
Andre Arnett´s last blog ..Reasons Why You Should Consider Using PLR
[Reply]
Doug Champigny
Twitter: CaptnAffiliate
on September 19, 2009 at 7:44 pm
Great tips, Mike – and if I may add to it, be sure you check your results in BOTH IE and Firefox. The two browsers handle CSS differently, and you can get some nasty surprises if you just check it in one or the other.
Also, while point size is important for controlling text, remember that different resolutions on readers screens also change the size the type displays at on their screens – heed Mike’s advice and use 12 point as a minimum – personally I prefer 14 point for most applications.
Finally, if you’re not comfortable messing with code, outsource it to a designer – in general they’re less expensive than people assume, and for minor jobs you can often get people to do it for you just by asking your followers on Twitter. Offer a trade-off – they tweak your theme in exchange for you sending an e-mail promoting their product or service, for example.
Truth is, you need to know how to tweak your blogs and sites for those times when you’re in a hurry, but in general outsource what you can so you can focus on your marketing – that’s where the real money is!
Doug Champigny´s last blog ..Position Your Internet Marketing Biz For The Economic Recovery
[Reply]
Brett McEllhiney on September 19, 2009 at 10:23 pm
Thanks for the tips Mike!
While I did know how to do a couple of these, there were a couple of things I was not aware of (I.E. the line space). Didn’t even know that was an option.
Definitely need to learn more about CSS. I know some of the basics, but am far from having even a remote bit of mastery of it.
Thanks again
Brett McEllhiney´s last blog ..Autopilot Clickbank Income Pt. 2: How To Get There
[Reply]