How to Optimize a WordPress Theme for Search Engines

Share:

An SEO optimized WordPress theme is a critical component if you want to make money online. When I started the Dough Roller in May 2007, I focused exclusively on what a theme looked like. At the time I didn’t know how to modify the look of a WordPress theme, and I knew nothing (literally) about search engine optimization. In fact, I had never heard of SEO! If I only knew then what I know now.

Last week we covered how to pick a domain name and install WordPress. If you care at all about search engine rankings and want to make money blogging, there is no reason not to implement a well optimized WordPress theme. So today I’m going to discuss the things I look for in a well optimized theme. I’ll also show you some free WordPress themes that are what I call SEO compliant. And then I’ll walk through how to upload a theme to your server and activate it in WordPress. We have a lot to cover, so let’s get started.

How to optimize a WordPress theme for search engines

Rather than give you some grand theory about SEO, I thought the best way to introduce this subject is to walk through some of the SEO elements I look for when evaluating a WordPress theme. So here they are:

SEO optimized h1 tags: WordPress and the blogging world use lots of tags. You have the WordPress tags you can enter for each post, there’s technorati tags, and there are html tags such as h1, h2, h3 and so on. I’m talking about html tags, which serve at least two purposes.

First, html tags when styled with cascading style sheets (CSS) define how the text between html tags will look. You can define for yourself what your html tags will look like, including font size and color.

Second, and important for our purposes, html tags communicate to search engines the relative importance of the text on your page. The h1 tag conveys the most significance and should be used once and only once on each page of your site. The h1 tag typically appears in the header.php file of a WordPress theme because most themes mark the name of the blog with the h1 tag. (if you’re new to WordPress, click on Design–>Theme Editor–>Header.php, which you should find along the right hand side of the window containing your theme’s php code.) Here’s an example of code you’ll find in many WordPress theme header files:

Note: Ignore the line breaks; they are necessary to properly display html and php code.

The above code does two things. First, it displays the name of your site as entered in the Settings of WordPress (Settings–>General). Second, it links the name to your home page, which is why clicking on the name of most blogs takes you back to the home page. Recall that last week we discussed the advantages of having your keywords in your domain name. If you do, then surrounding your blog’s name in an h1 tag is a good SEO start. For the Dough Roller, however, my keywords aren’t in my domain name, so I’ve modified my header file with the following code:

As with the code above, ignore the line breaks, which I’ve added to make the code more readable. Also, I’ve added the line numbers so we can break down this code easier. So here’s what this code does:

  • Line 1: The “headliner” id comes from the Stylesheet file (CSS) and defines how the text will appear (font, size, color, etc.).
  • Line 2: Opens the h1 tag so that everything following it until the closing /h1 tag is identified by search engines as very important. Following the h1 tag, I’ve added the keywords that are important to my site. Actually, I should probably move the word “smarter” to the left of the h1 tag since I’m really focused on “money management.” In fact, I’ll make that change soon. On the home page, “smarter money management” is the only text within h1 tags.
  • Line 3: When a single post is being displayed (in contrast to the home page, category page, and so on), the title of the post will be added to the h1 tag. If I’ve written my title to include keywords as I should, then adding them to the h1 tag will help with SEO.
  • Line 4: This does the same thing as line 2, except for WordPress pages.
  • Line 5: This line closes the h1 tag and the div.

Now, I’m not suggesting that this is the only or even best approach. I first learned it from Court’s Internet Marketing School, a site I’ll talk about and link to in a minute. Alternatively, for single post pages you might put the category and post title in the h1 tags. The key is that you want your top keywords in the h1 tag. And in my opinion, you don’t want the same h1 tag for every page of your site, although there are good exceptions to this rule.

SEO Optimized h2 and h3 tags: Unlike an h1 tag, it’s ok to have more than one h2 and h3 tags on the same page. The key problem I see with many WordPress themes is that they use the h2 tag to mark the headings in sidebars. The result is that Google thinks the words “popular posts,” “categories,” “blogroll,” and the like are really important keywords to your site. So if your theme uses h2 tags for the sidebar headers, change them to h3 tags. You may need to make changes to your Stylesheet file to change the way the h3 tags look; that will just depend on your theme and what look you’re after. I tend to reserve h2 tags for keyword rich headings in my posts.

Changing the sidebar tags from h2 to h3 is easy. Simply open the php file(s) in your theme editor that contain the sidebar code, and look for the headings that appear in your sidebar. You should see them surrounded by an h2 or h3 tag, most likely. If it’s an h2 tag, simply change it to h3.

Loading content before sidebars improves SEO: This is a simple one, and it amazes me that WordPress theme designers get this one wrong. You want your articles to load before your sidebar. Why? Two reasons. First, you do not want readers surfing away from your site because they got tired of waiting for the content why your sidebar loads. Sidebars often contain ads and java script that can take some time to load. Second, search engines generally give more weight to the content higher up on the page. So why tell the search engines that your blogroll is more important than your articles?

So how do you tell whether your content loads before your sidebar? You can load a page of your site in a browser, go to the “view” menu and click on page source (in Firefox, please don’t tell me you use IE). Look at the html code that comes up and see if your post content is above or below your sidebar content. You can also look at the “Single Post” theme file and see which comes first, php the_content() or the code that calls your sidebar(s).

Remember that the location of your sidebar has absolutely nothing to do with whether it loads first. The sidebar can be to the left of your content and still load in the browser after the content is loaded. If you find that your sidebar loads first, you’ll need to move the code that calls the sidebar to come after the code that loads the content.

Using excerpts to avoid duplicate content: Google hates duplicate content. And unfortunately, a WordPress blog can have tons of duplicate content. For example, a single post can show up on the home page, the single post page, multiple category and tag pages, an author page, and an archive page. There are several ways to address this problem. One is to use a robots.txt file to keep Google and other search engine bots from indexing all of these pages. But I prefer a different approach, which is to just show an excerpt of the article on all of these pages (except for the single post page, of course).

The problem is that many themes aren’t built that way. The Grid Focus theme I use for the Dough Roller, for example, doesn’t even come with a category.php file. So when a user clicks on a category like credit cards, what theme file displays the content? If the theme doesn’t have a specific file to deal with the category view, it simply uses the index.php file. In my case, that currently displays the entire post, so the category page also displays the entire post. As I wrote this article, however, I fixed this problem in literally about 60 seconds. I’ll show you how, and you can then apply this fix to other pages such as tags and archives if you want to.

In BlueHost (or whatever hosting service you use), go to the file manager. You can refer to my post last week on how to install WordPress if you are unsure how to do this. In file manager, navigate to your theme files, which you find in wp-content–>themes–>[name of theme you are using]. With Grid Focus, my theme files look like this:

Find the index.php file, highlight, and select the “copy” button toward the top left of the screen. When you copy the file, name it “category.php”. This is important, because WordPress searches for this file when a user navigates to one of your categories. Once you’ve copied the index.php file and renamed it category.php, it will show up in the theme editor of WordPress.

Cautionary Note: You should not modify the production environment of your site, particularly without first making sure you have EVERYTHING backed up. Confession: I modify the production code of my sites all the time, but it’s a really, really bad idea.

Now from WordPress go into the new category.php file you’ve created (which currently is identical to your index.php file), and search for the following code:

Your code may or may not have the “Read the rest” in the parenthetical. (The text in the parenthetical is displayed if you insert the “more” command in a post.) You’ll then replace the portion of this code that reads “the_content(‘Read the rest’)” with “the_excerpt()”. Save the file and you’re done. Now your category pages will all show excerpts of the posts rather than the full posts. Not only is this better for SEO, but I think users prefer this approach, too.

One last thing. When you write a post, one of the boxes within WordPress is for excerpts. if you fill in this box, the content will be displayed whenever the excerpt of the post is displayed. If you leave this box blank, WordPress instead shows the first four lines or so of the post. It’s really a good idea to complete the excerpt box for each post, but I’m guilty of neglecting this step.

Links in the theme’s footer are critical to search engine optimization: When I first started blogging, I didn’t give much thought to the footer. I figured nobody ever read the content in the footer anyway, so why bother. It turns out, adding the right links to the footer can be a big SEO plus. We’ll talk more about that in the weeks to come, but for today, the important point is to note what links the theme author requires you to leave in the footer. What you want to avoid are themes that come with 3 or 4 links in the footer, including paid links to spam sites. One link back to the author’s page is fine, much more than that and look for another theme.

And this brings us to the next topic. . . .

Free SEO WordPress Themes

The thought of significantly modifying a WordPress theme may not be your idea of a fun time. In addition, you may just want to start off with a well optimized theme to save time. Fortunately, there is a great resource that offers free optimized WordPress themes. Court’s internet marketing school is a great resource if you want to make money blogging.

One of the things Court has done to promote his site is to create WordPress themes optimized for search engines. And in addition to offering these themes for free, he also offers a great lesson in internet marketing. Question: Why is Court going to all this trouble to build themes and then give them away for free? Is he just a great guy? Well, I’m sure he is a great guy, but there is some self interest involved. Each theme includes a link in the footer back to his site. So every time somebody uses one of his themes, he gets a free link. He has even purchased themes, modified them as necessary to improve search engine optimization, and then made them available for free. In fact, one of the themes he now owns is the one used by JD at Get Rich Slowly.

So if you are looking for a well optimized WordPress theme, check out what Court has to offer.

How to install a WordPress theme

For those just starting out, let me quickly walk through how to install a WordPress theme. I’ll use BlueHost in the example, but the process is generally the same for any hosting service.

Step 1: Select your theme and download the zip file to your hard drive.

Step 2: Log into BlueHost and open up the File Manager.

Step 3: In the File Manager, navigate to the WP-content–>Themes folder.

Step 4: Once you’re in the theme folder, click on the “Upload” button toward the top left of your screen:

Step 5: From the upload screen, select the “browse” button and find the theme zip file you downloaded to your hard drive. Once selected, Bluehost will automatically upload the file into your theme folder.

Step 6: Go back to your theme folder and find the zip file you just downloaded (you may need to refresh the screen). Check the box next to the zip file and select the “Extract” button near the top right of your screen:

Follow the prompts to confirm the action, and you’re done. Now when you go into your site’s WordPress Design–>Theme, you should see your new theme as an option. Simply select it by clicking on it, and you’re ready to go.

I know this has been a long post. My goal is to walk through these steps in as much detail as possible. But remember, once you’ve got this down, you will be able to buy a domain, get it hosted, install WordPress and a theme, install necessary plugins, and configure WordPress all in about 15 to 20 minutes. So our next step in the process is to install some critical SEO plugins and to configure some of the WordPress settings that will help in the search engine rankings. We’ll cover these topics next week.

Published or Updated: April 9, 2014
About Rob Berger

Rob founded the Dough Roller in 2007. A litigation attorney in the securities industry, he lives in Northern Virginia with his wife, their two teenagers, and the family mascot, a shih tzu named Sophie.

Comments

  1. Constance says:

    I wish I understood the words that were being displayed.

  2. Armandina Roloff says:

    That was a sweet tip, thanks for sharing your knowledge

  3. Sabrina Hope says:

    Thank you for the help. I was able to upload a new theme with no problem into my File Manage (I’m using Hosting Sesame). I just had trouble making it the default theme. I didn’t realize I needed to go to my WordPress dashboard and click on my new theme.

  4. I appreciate the write-up, I used your advice and modified my theme (theDawn) to move the content above the sidebar. Looks great and hoping to see results soon.

  5. Stolice says:

    Very useful to me. Many thanks for sharing this.

  6. Sumit says:

    Very nice tips to optimize. I am searching for a question. I want a sidebar only loads once on a website and not reload every time someone open other pages of website. Please let me know if you have answer.

  7. Uber Steward says:

    Hey Rob, thanks for the helpful post. I was wondering, how can you get that orange horizontal pop-up at the top, is that some kind of plugin?

    I’ve seen that othet blogs and I really like it. Thanks.

Speak Your Mind

*