Dec 05 2007

Tutorial: Add a Background to your WordPress Theme

Char| Category: Tutorials, WordPress | 7 Comments

Note: This is one in a series of tutorials on customizing your WordPress theme geared to the beginning or intermediate WordPress user.

One of the easiest ways to customize a basic WordPress Theme is by changing the background. Using this step-by-step guide, even novice bloggers can make small changes that will have a big impact!

When you first install WordPress the default template is loaded and it looks something like this:

WordPress background tutorial

In order to make changes to it, you need to first log in to your WordPress dashboard, choose Presentation and then Theme Editor. On the right hand side you will see a list of files you can edit. Select style.css.

WordPress background tutorial

Scroll down to the part of the code labeled body. In that code block you will see a line that says background. This is the part of the code that tells the template what color and/or background image to display. If you just want to change the background color and do not want an image in the background, you can easily change it.WordPress background tutorial

I deleted the piece of code starting with “url” and replaced the color code with one for a deep red - #990000 (see a complete list of color names and codes). Once you make your change, select Update File and go take a look at your results.

WordPress background tutorial

Let’s say you want to get a bit fancier and would prefer to use one of the many beautiful free backgrounds available on the web (check my list of 13 sites for Beautiful Patterns and Backgrounds first). In which case, you need to find the background you want to use and download it. Use an FTP program (Need help? See my FTP tutorial for details) to transfer the .gif or .jpg file into the theme’s image directory.

WordPress background tutorial

Once the file is there, go back into your WordPress dashboard, select Presentation, then Theme Editor and open up the style.css file again. Take a look at the background line of code again and change kubrickbgcolor.jpg to the name of the background image you want to use - in my case, distressed-in-blue.gif (from Din Pattern).

WordPress Background tutorial

Select Update File and take a look at your handy work.

WordPress Background tutorial

Each theme you use is going to coded a bit differently, but the majority of them should operate very similarly to this - especially the ones that are well-coded. Once you get comfortable working with the style sheet and its components, it is relatively easy to make basic customization changes.

I plan on adding more tutorials to this series in the near future with one on adding a graphical header, customizing your fonts and colors, as well as other basic WordPress techniques. If there is any particular topic you would like me to deal with sooner rather than later, let me know!

Aug 24 2007

5 Things About Design and Me

Char| Category: Blogging, Web Design, WordPress | 12 Comments

Bloggy TagBrian Gardner, creator of some of the finest WordPress themes out there, has started a meme (also known as a game of Bloggy Tag) on 5 Things About Design and Me. He tagged me along with four of my blogging pals (Randa, Charity, David and Tara) to kick this off.

What is something that would surprise people about you and design?

Like Brian, when it comes to WordPress and blog design I am completely self-taught. Actually when it comes to web design, development, coding and such, I am self-taught on all of it (like Randa and Lisa). In 1996 when I first started my business I did a lot of document formatting and production using MS Word. Somewhere along the way the Web design bug bit me and I just kept at it. Over the years I have learned a lot through trial and error, using sites and designs I like as inspiration, and I have listened to the needs of my clients and tried to design the kind of site that works best for their individual needs.

If you could design one blogger’s site for free, who would it be?

One of the most enthusiastic bloggers I have met is Eliza (HomeMom3). If she ever gets ready to move to her own domain, I would love to help her really find a look that will show off her personality and content.

What blog platform do you prefer, and why?

WordPress is absolutely my number 1 choice as a blog platform. The developer community that is built around WordPress is amazing. If you just look at the sheer number of plugins available, free WordPress themes and number of blogs built on the platform it is just a testament to the power of WordPress. I have begun using WordPress as a way to build traditionally static sites that have a CMS component. Clients like it because they can maintain their own content with out having to know HTML. Brian’s new Revolution theme is going to give even more designers the tools needed to create great looking CMS-based sites in a fraction of the time.

Aside from your own, what is your favorite blog theme/template?

When it comes to themes that are well coded and easy to customize, Brian Gardner and WP Designer are my two favorite sources.

There are so many themes that are truly works of art, but my three favorites are: N Design Studio (aren’t the colors amazing?), Veerle,  and WebDesignerWall.

Do you have a blog-reading guilty pleasure?

Not really. I love starting my morning with a cup of coffee and Google Reader. I scroll through and look for articles I want to read, then I open each in a new tab to get the full reading experience. I have my reader organized into quite a few categories and it could possibly make the average person’s head spin. But, I have wide range of reading interests and I don’t want to miss anything! Some days I will check back in while surfing on my laptop while the family watches TV.

Who’s Next?

Well, Brian started the list off with 5, but I don’t think I have that much restraint. I would like to hear from the following designers:  Dawud, Lisa, Vivienne, Tony, Aaron, Mike, Mike R., and Mike S .

Jun 25 2007

The Evolution of a Blog

Char| Category: Blogging, Web Design, What I Learned, WordPress | 22 Comments

As part of my blogging birthday celebration I thought I would share with you where this blog started and how it got to be what it is today! If nothing else, I hope this can serve as inspiration for bloggers who are starting out or more experienced bloggers who want to take their blogs to the next level.

Evolution of a blog

Essential Keystrokes, Version 1.0 - the Blogger Days

We all have to start somewhere! Google’s Blogger platform was initially my choice because it was FREE, easy to get started, and it sounded like a good idea at the time. It was also a fairly good way to get comfortable with tweaking themes, and trying out different monetization options.

Essential Keystrokes Version 1

During that first version, I logged 50 posts between June 22 and September 29. Other stats include a whopping 31 comments, 11 inbound links and less than 200 uniques per month.

As I got my blogging bearing, it was evident that Blogger was not the way for me. I was limited by its constraints and no one even had a chance of remembering my URL. Around this time I had also started reading blogs like Easton’s Business Blogwire and Liz Strauss’ Successful Blog. The more blogs I read, the more I realized it was time to get my own domain name and try the WordPress platform.

Essential Keystrokes, Version 2.0 - Learning WordPress on the Fly

In September I purchased two new domain names - essentialkeystrokes.com and casualkeystrokes.com (realizing I needed an outlet for non-web design topics) and jumped into WordPress head first. I posted my first distress call less than a week later! Lorelle of Lorelle on WordPress came to my rescue - how is that for help???

Essential Keystrokes version 2

Not one to go with the crowd, I searched high and low for a WordPress theme that was different from all the others I had seen. I found BoxyBlue from Geeks Make Me Hot and knew it was the one. I went to work tweaking the theme to make it my very own. Within the first month on my own domain my traffic more than TRIPLED, I learned how to get out there and be social, and Brian Clark of Copyblogger chose one of my headlines to remix (I still say WOW).

I also joined the MomGadget forum where I met Gayla and the rest of the crew. This is an inspiring group of bloggers and I can honestly say that their enthusiasm and willingness to share ideas, tips, and secrets for success really helped me gain a new insight into blogging.

In December I had a phone conversation with Liz at Successful Blog that became the inspiration for a very popular weekly series called Essential Tools, which has now had 27 installments. WOW!

By March my average monthly uniques was around 3,000 with page views above 45,000 and I broke the top 50,000 for Technorati (that’s a huge improvement from the bottom of the barrel.)

And then I started feeling “boxed” in.

Essential Keystrokes, Version 3.0 - I’m Starting to Hit My Stride

By late March I was beginning to feel boxed in by the two-column design of my theme and was on a hunt for something new. I looked high and low, and suddenly it hit me! My design was right in front of me. Since Essential Keystrokes is my “business” blog - an extension of my web design business, Keystrokes Design & Marketing, shouldn’t the two look something alike?

Keystrokes

The three column layout of dkret was a good fit for the design. I designed the new look “live” and got some really awesome reader feedback in the process - something I would have totally missed had I not invited participation (thanks Kevin). Three cheers for collaboration!

I added some great plugins to help my blog with SEO, highlight popular posts, and encourage reader participation. As a result, May was fabulous! My uniques are now above 4,000, page views are topping 56,000 and Technorati has me at 17,000 now. I’d like to thank my 200 RSS subscribers, too. This blog has a LONG way to go, but it is clearly making progress.

There you have it! All you ever wanted to know about this blog - whether you wanted to know or not! Seriously, I really hope that this can help give some perspective on the evolution of an average blog. It’s not easy (but it’s not rocket science either), it takes a lot of patience, and you have to be willing to enter each day ready to learn.

It will be a lot of fun to look back on this post a year from now and see where the blogging world has taken Essential Keystrokes.

PS - Don’t forget about the great giveaways this week!

«older posts newer posts»

© 2006-2008 Essential Keystrokes | Wordpress | dKret 1.9 heavily modified by Char at Keystrokes | Hosting by HostGator