7 Day WordPress Camp : Day 3

Continuing from 7 Day WordPress Camp : Day 2

We are on the Day 3 of our course. So far we have done most of the work and today we are going to optimize our blog to the extreme. This is called “Onpage Optimization” or “Onsite Optimization” as it’s a server side process. You may call it whatever you want, but the tricks are same.

First we will start with customizing our theme. It’s about placing proper tags in proper places, adding some extra codes and tweaking/modifying some of the existing codes. You can either do it from your Admin CP or you can manually download the theme files and upload after editing using FTP. To edit the files from Admin CP, the theme folder under “wp-content/themes” should be writable (CHMOD 666 or 777). Go to Appearance > Editor to start editing. You’ll land on the CSS (Stylesheet) file at first. You can choose other files from the list at right to the editor box.

1. Advanced Customization of the Theme

• Header (header.php): Let’s start with the header section. It’s one of the pages which get included in all your pages and it also tells search engine how to handle your web page.
  First, we need to help search engines to find our blog’s character set. It helps them to read a web page easily. Add this line to head section if it’s not there already.
  <meta http-equiv=”Content-Type” content=”<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />

  Second, most of our plugin requires a hook in the head section to automatically insert data (For Example, Platinum SEO and XML Sitemap Generator). Look for a piece of code <?php wp_head(); ?> in head section. If it’s not there, our plugins will fail to word. If it’s not there already, add that before </head>.

• Content (single.php): This is the page which shows the single posts. Also, the same edits goes to Single Pages (page.php).
  Not much edits here. Check if the Post Title is on h1 tags. Look for the code <?php the_title(); ?>. Change it to <h1><?php the_title(); ?></h1> if it’s not the same already. You can change the font, color, size of this tag in CSS.
• Footer (footer.php): No edits are possible if the page is encrypted. If not, look for the code <?php wp_footer(); ?>. It’s the footer hook that is required by some of the plugins like WP-O-Matic, WP-Video Tube. If it’s not there, add it before </body>. If you have any visitor tracking utility like Statcounter, Google Analytics, you can place the tracking code before </body>.

2. Onpage SEO (Onsite SEO)
We will do some server side tweaking here. Most of them are based on suggestions from YSlow and Google PageSpeed tool. However, some of the tweaks may not accessible for Shared Hosting users. If you are on that, don’t worry, those tweaks will not affect much.

Google Page Speed

• Compressed Ouput: This may save tons of bandwidth as well as send your pages faster to visitors. After release of Google Caffeine, this has become the must to do thing. We need to edit the .htaccess file for this. Download the .htaccess file at your document root and open it with Wordpad or Notepadd++. Now add the following code below other codes.<IfModule mod_deflate.c>
  <FilesMatch “\.(js|css|php|html)$”>
  SetOutputFilter DEFLATE
  </FilesMatch>
  </IfModule>

  This feature requires the mod_deflate module installed on Apache Webserver. One of the reasons I mentioned those webhost.

• Caching of Files: This tells web browsers to cache some of your files to the visitors computer to decrese the pageload speed. Add the codes below to the bottom of the existing codes in .htaccess file.<IfModule mod_headers.c>
  <FilesMatch “\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$”>
  Header set Expires “Thu, 30 Aug 2011 20:00:00 GMT”
  </FilesMatch>
  </IfModule>

  It requires the mod_headers module installed on the Apache Webserver. One of the reasons I suggested those webhosts.

• URL Rewite: It rewrites the default wordpress URL to SEO Friendly keyword rich URLs (Pretty URLs). This is required for “Custom URL Structure” that we had setup yesterday to work. Add this code to the bottom of the existing codes at .htaccess file.<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.php$ – [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.php [L]
  </IfModule>

  It requires the mod_rewrite module to be installed on Apache Webserver. One of the reasons I suggested those webhosts.

• Optimizing CSS and Javascript files: This is required to decrees page load speed as well. I recommend using Minify Script to combine and minify the CSS and Javascripts. You’ll get the detailed instruction on how to install it and implement here.

We are done today. Your blog now stands out from millions of other similar blogs and have a good chance to rank in search engines.
See you tomorrow on the 7 Day WordPress Camp : Day 4. Don’t forget to grab my RSS Feed.