Archive for 'April, 2008'

In this “Wordpress Hack” you’ll learn how to create a custom 404 Error page for your blog. It’s helps your visitors find what they need, and also helps you not lose visitors!

The WordPress “Hack-A-Thon” continues in our “30 WordPress Hacks in 30 Days Series” to help you get control of your blog!

One page you probably don’t look at very often (if ever) is your 404 Error page. What is a 404 error? It’s when someone tries to visit something on your web site and it isn’t there – the webserver displays an error page. Normally the page is white with plain black text with a short message about “the page you’re looking for cannot be found”. WordPress displays a custom 404 page based on the template file “404.php” contained within your theme directory, but by default most themes don’t have much more than “Error 404 Not Found”.

Currently my 404 error page is pretty useless showing just a heading “Error 404 Not found” and a white blank screen inside my wordpress template. I’m going to fix that as I write this hack for you. What causes these 404 errors? It only happens 2 ways, either somebody types or pastes in a bad address in the URL field of the browser, or somebody clicks on a bad link (on your site or from another site). When Wordpess can’t find the page or content it displays a page using the 404.php error. This would be a good time to mention the 404 Notifier WordPress Plugin that will email you every time someone gets a 404 error on your site. It’s an important gauge of whether people are having issues with your content (being found) or not.

A good place to start would be the WordPress Codex page on Creating an Error 404 Page. The first thing it says is that you want to remove the ugly error and replace it with something that will help visitors find their way. I couldn’t have said it better myself.

It also says that you are looking for the following text, and should modify the H2 header and add some paragraphs of text below it:

<div id="content">

<h2 class="center">Error 404 - Not Found</h2>

</div>

There isn’t a lot of “codey hocus pocus” going on there, you just want to give users a friend message, some text to humor and help them, and then it’s up to your where you want to direct them next. Some of you may want to list your most popular posts, or maybe certain categories or pages, but in my case I want to link to only a few of those. Then I’m going to enlist the help of the Ask Apache Google 404 WordPress Plugin. It’s going to try and figure out (based on the URL) what it was they were trying to find, and display google results (for your site) to the user to try and help. I personally would prefer this plugin to search my blog only for results, but since this is the only plugin I could find that does this – google results will have to do. Check out how pimped out my 404 page looks now!

As you can see in the image above (or the link to view it directly) – we’ve come a long way baby! No more bland error page, now we get an email every time a 404 not found error is generated, and the users get a friendly message with automatic google results to try and find what they were looking for! Like I initially said – this hack helps our visitors, and helps us “keep” our visitors on the site all at the same time!

Here are some other good 404 examples to look at for inspiration:

Problogger’s 404 Page
Smashing Magazine’s Error Pages Reloaded
Web Professor’s 404
Home Star Runner

As always – if you have questions or something to add to make this hack even better, please comment now! Stay tuned for tomorrow’s WordPress hack so we can keep pimpin’ out our blogs!

I’m going to do something I very rarely do and post a little update about what’s been going on behind the scenes here at JTPratt’s Blogging Mistakes. Things have been very busy, and time is something I definitely don’t have enough of – it’s a luxury. A few months back I got an email from Forbes.com. I mean, it’s kind of weird – at first you kind of have to question if it’s real or not when you get an email from a large company. In the past I’ve gotten emails from Yahoo and Microsoft and a few other places, but Forbes.com is just weird. In the email they asked me to become part of their new “blogging network”. I had think about this at first, because I didn’t now what “network” meant. I just wanted to make sure that it wasn’t going to be a free for all where anyone who signed up was let on board. You can read the forbes.com blog network official press release here.

It turns out that 400 blogs were hand selected to start the network, and out of 100 million+ blogs on the web, somehow this blog was chosen. In the phone interview I did the day after I got the email I asked a lot of questions, and the woman who sent the email told me that there were lots of blogs on the web that were a lot of fluff but light on content. She said my posts were easy to understand, very resourceful, and she could tell I actually knew what I was talking about. I’ve done a lot of hard work on this blog in the last 6 months and I’d like to think that’s the reason she not only found the blog (in search), but found it resourceful once she read it.

What does all this mean? Well, my posts won’t get featured in Forbes magazine, that’s for sure. I was told that my blog falls within the “business and technology” section of the blog network. I was told that once the network is up and running that my posts (probably excerpts) could be featured on forbes.com alongside their current articles when relevant. Forbes.com gets over a million visits per day. Now this blog network is sounding pretty enticing! Even if I was only featured once or twice per year it would be worth the link love alone. Will this ever happen? I don’t know – only time will tell.

So behind the scenes I’ve been preparing for the network launch. It’s kind of like when you know the relatives are going to come over and you do all that last minute cleaning.’ Even though you live in your house every day, when you know somebody is coming over (especially friends and family) you start seeing dirt in all kinds of places you usually just pass by. So knowing that being part of this new blog network I could get a lot more exposure and visitors is exciting and maddening all a the same time. I immediately began to think of ways to customize my theme, improve the look and feel, better monetize, and improve the overall experience for users. That’s why you’ve been seeing a lot of posts lately about hacking wordpress and creating and customizing your own theme.

So at this point, even if I never get featured or mentioned on forbes.com something good has come out of the relationship since I created my own custom them (which is still evolving), and I’ve written everything up in posts and articles for all my readers to benefit. Also in the last few weeks my RSS subscribers have doubled and so has my daily traffic. The blog network “soft launched” yesterday and they said that if we put up the ads they would be mixed “default” ads advertising the network mixed with some real ads from test sponsors. In addition, we do get paid for any of the test sponsor impressions. The nice thing about this network as well is that it’s CPM based, so you get paid by traffic, not by click. When the Forbes.com blog network fully launches over the next few weeks they are supposed to sell ads for our respective categories, so more relevant ads should be showing up in more frequency (and hopefully I’ll be making more money).

On that note, with all the changes going on with the structure of this blog if you’ve seen freaky things happen, like headers or sidebars disappearing, or pages for poor formatting or huge fonts – that’s why. Just today many hours were spent trying to fix issues with my header, my logo, and the banner, and also my post headings. As it stands now everything is perfect in Firefox, horribly mangled in IE 6, and the banner is somehow missing in IE 7. If you are reading this post in an RSS reader, please visit my main page in your browser a single time for me, and email me with your operating system and browser if the page is screwed up in any way. This will help me iron out the kinks! For any readers that have the time – I would appreciate it, just use my contact form to send me a note, and you can attach a screenshot there as well! For questions or anything to add – please comment now!

When visitors search your WordPress blog are they finding what they need? Did you know you could monetize your search results? This “wordpress hack” will teach you how to build your own custom search results page and template.

This is Day #3 of our WordPress “Hack-a-thon” of 30 WordPress Hacks in 30 Days. If you haven’t already – now is the time to subscribe by email or RSS at the top of the page!

Every WordPress blog has a search feature, and when people enter keyword into that search box they expect to find relevant results. I’m going to teach you how search works behind the scenes in WordPress, and how you can customize it for your blog. First let me say that WordPress has it’s own search mechanism – and it doesn’t use google or other search engines for results – it searches posts and post titles within your database. If you were interested in incorporate google custom search results in your WordPress theme and template this is not the place. Instead visit Google Custom Search in WordPress. There was a time when I used google results instead of WordPress search in my blog and I just don’t recommend it. First, they advertise that it will make you money, but on a site getting 10,000 unique visits per day I only made between $1.50 and $2.00 per month. Second, google will only show pages you have indexed in your results. What if all your pages aren’t in the google index?

The first step in customizing search in WordPress is understanding the elements involved:

• searchform.php: The searchform is not a page, it’s a template file. Whenever you see a search box on a blog page, this search form template file is called and it’s code is used to place the search box on the page. If you ever wanted to change or style your search box, this file is the one you would edit to do it. We’re not going to be changing this page at all today.
• search.php: The search.php page is also a template file, the one that’s used any time search results are displayed. Since most WordPress themes have a search box somewhere on every page you can usually search anywhere. The results that come back use this template file
• searchpage.php: More than likely your blog doesn’t contain it’s own “search page” specifically because of the previous point (you can search anywhere). There is however, no reason not to create one. It’s yet again another page to get indexed in the search engines, yet another page to place original content, yet another page to monetize, and yet another page to point people to important content throughout your site. We are going to create a custom search page or “searchpage.php” today in this tutorial.

As I mentioned, we won’t be customizing the search form today, but we will be creating a custom search page and customizing the search results template. First we’ll make the search page. When completed, this will be a page included in our “Pages” block in the sidebar. Let’s start at the the usual place, the WordPress Codex page for ‘Creating a Search Page’. It’s a pretty straightforward tutorial for creating a WordPress search page. You going to download your “page.php” file from your WordPress theme directory. If your theme doesn’t have one – follow the directions in the previous link for creating one. Save that file as “searchpage.php”.

At the top of the page before anything we need to declare the template name – copy and paste this code:

<?php
/*
Template Name: Custom Search Page
*/
?>

Next you need to any information in “the loop” from this page which you might not need like the meta information (date posted, comments, tags or categories, etc). I can’t tell you what will be in your theme, because every theme is different. I’ll show you mine to use as an example in just a second. You need to add in a heading and search form by pasting these lines (after ‘the loop’):

<h3>Search This Blog</h3>

<?php include (TEMPLATEPATH . '/searchform.php'); ?>

Save “searchform.php” and upload it to your WordPress theme directory. Your file should look something like this at this point:

<?php
/*
Template Name: Custom Search Page
*/
?>

<?php get_header(); ?>
<div id="wrapper">
	<div id="content">

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  <div class="post" id="post-<?php the_ID(); ?>">

<h2 id="post-title"></h2>
<br />

	<div class="entrytext">
	  <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
	  <?php link_pages('<p>Pages: ', '</p>', 'number'); ?>
	</div>
  </div>
<?php endwhile; endif; ?>

<h3>Search This Blog</h3>
<br />
<?php include (TEMPLATEPATH . '/searchform.php'); ?>

	<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>

	</div>

<?php get_sidebar(); ?>
</div>
<?php get_footer(); ?>

To see what I wrote as an example – just visit my “search everything” page. Now that we’ve build a custom search page, let’s customize our search results! Before I customize any code at all – I’m going to install the “Search Everything WordPress Plugin“. Normally wordpress only searches titles and the content of posts. But by installing search everything searches can also be configured to look at tags, comments, category names, excerpts, attachments, custom fields, and eve drafts! It can also be used to “exclude” from search any category or post or page ID.

Next, in your dashboard go to “Presentation -> Theme Editor -> Search Results (or search.php)”. This is your “search results template”. Any changes you make to this file will customize the way your search results come out any time a search is performed on your blog, whether from your new search page we created earlier, or from the search box on any page of your blog.

The search results as has a loop, and the way “the loop” works for search results is the same as any other WordPress templated page. It will show up to 10 results, and then next and previous links to get the rest of the results. In the case of search, it will show your most recent posts matching the keywords searched first, and then the older ones – which will (from the first search result page) only show a rediculous “<< previous entries" link. Some users not used to blogs or WordPress will assume there are no more search results other than they see on the first page of results. I want some "google style" navigation for the search results that most people are used to seeing to make my search results more usable. Once again - we're going to use a Lester Chan plugin to get this done, WP-PageNavi for Page Navigation.

Again, every theme is different, and my theme has next and previous navigation before and after “the loop” in my search.php template. I’m going to remove it and replace with the WP-PageNavi wordpress plugin’s navigation. First I find the current navigation, which in my template looks like this:

<div class="navigation">
	<div class="alignleft"><?php next_posts_link('&laquo; Previous Entries') ?></div>
	<div class="alignright"><?php previous_posts_link('Next Entries &raquo;') ?></div>
	<div style="clear:both;"></div>
</div>

Yours may look different, look for the lines with “Previous Entries” and “Next Entries”. I’m going to replace it with the plugin’s code for navigation:

<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?>

I made that change at both the top and bottom of my search.php because I want to have navigation before and after my search results pages. I wish google did! Now that I have decent navigation it’s time to do a little monetization of the search results. One thing I didn’t mention previously was that when we created the custom search template earlier, I did place an ad in the bottom of that page after “the loop” for my blog network. However, that ad will only display on the “search page” we created. To have any kinds of ads display in our search results themselves, we have to place them in the “search.php” as well. I’m going to place one google adsense block above the search results, and one blog network ad at the end of the search results.

I’m also going to place some adsense blocks interspersed throughout the search results, and to do that I’m going to place the following code within “the loop” of search.php:

<?php if ($count==2) { include('search-adsense-inline.php'); } ?>
<?php if ($count==6) { include('search-adsense-inline.php'); } ?>
<?php $count = $count + 1; ?>

Let me explain what’s going on here. I logged into adsense and grabbed some code for an adblock and I pasted that code into a new file I named “search-adsense-inline.php”. I uploaded that file to my theme directory. Then I placed the code above in my loop in search.php. The first lilne says to grab the contents of that file and place the ad after the second post, and the next line says to do it again after the sixth post. Google now lets you have 3 adblocks (a 3 text link blocks) per page, so with the first block before my results and then these two, that’s the max (adsense) ads I can place here. The third line sets up a counter that starts with the first post, and ads one for every post from 2-10 so it knows where to place your ads.

This is entirely flexible, meaning you could ad more ads (that weren’t adsense) by creating other files and including them after other posts. You could not use adsense at all, and advertise or promote something else! They don’t even have to be ads, they can be links to your content, or funny and weird sayings to freak people out. ANYTHING you put in those files will be after the posts you choose, whether it’s a graphic, text, or code. Use your imagination – I just gave your a bazillion ways to now monetize your search results!

If that weren’t enough – I have yet another way, you can Monetize your search results with a datafeed as well, which will grab products from merchants online using your affiliate feed and show those results on your search results pages. The great thing about that hack is the fact that you never have a page with a blank search result again. If someone searches for “Wordpress Help” and you have no posts, an Amazon feed for instance would show books, or other products related to “Wordpress Help”. While I have your attention on search, I may as well tell you about another great search plugin Psychic Search, which saves information on all search performed on your WordPress blog. You can get reports and see what people have been looking for over the last week, or month, and beyond. It has reports on what they found, and which searches had no results at all. This is very, very helpful information to know – and possibly information you can use to create future posts!

I hope you learned something today, and now you should have a brand new search page and monetized pimped out search results! If you have something to add or a question, as always – please comment now!

In your WordPress blog do you have a sortable clean and easy way for visitors to access your previous posts? Other than the month based archive link in your sidebar, you may not have an archive index at all! It’s time you hacked your own Master Archive Index Page!

This is WordPress Hack #2 in our 30 “Hack-a-Thon”! That’s right, I’m going to give you one WordPress hack per day for 30 days, and at the end of that time you will have pimped out your blog like you never would have believed possible! Be sure to signup for the RSS feed or subscribe by email at the top of the page.

Out of the box the default Archives for WordPress aren’t very sexy. In fact, as I’ve mentioned in previous posts the word thing about WordPress (to me) is the fact that the content seems hard to navigate, hard to get to, and downright self-defeating at times. Let’s take this blog as it stands right now as an example. The homepage has one full post and 9 excerpted posts. The sidebar contains links to the last 10 posts, and most viewed posts, in addition to a link to categories and monthly archives. I can also search, and those are my basic options for finding content. The custom pages I’ve setup also lead to some article series and categorized content. I currently don’t have an HTML web page site map (just an XML sitemap for search crawlers), so there really is no way to get a birds eye view of all my content. I’m rapidly approaching 100 posts, but at any give time you’re lucky to have more than 10-15 options for content as you surf around my blog.

Your theme may or may not currently display any more than month based archive pages, which will just be links in your sidebar to the months of the year you had posts. Some themes also have a calendar. All these normally do is use your “archive.php” in your theme directory as a template to bring up a list of posts the same way you index, search, category, or tag pages do – a list of up 10 to posts at a time with ‘previous’ and ‘next’ links at the bottom of the page. In my experience, most themes don’t have a master archive page (or what the WordPress Codex calls the “Archive Index”, although some have a “archives.php” file to create one from. Notice that this template file has an “s” on archives.php. Look in your theme directory, and you should have a file named “archives.php”. If you do add the first 5 lines below at the very top of that file, and the rest of the code in “the loop” of that page (after the header and before the endwhile). If for some reason your theme doesn’t have an archives.php, just download a copy of your “page.php” file, rename and save it as “archives.php” and then add these code to it (then upload to your theme directory).

<?php
/*
Template Name: Master Archives Page
*/
?>

<h2>Archives by Month:</h2>
  <ul>
    <?php wp_get_archives('type=monthly'); ?>
  </ul>
	<br />
<h2>Archives by Subject:</h2>
  <ul>
     <?php wp_list_cats(); ?>
  </ul>

Make sure you have the “Template Name” in the top. Now upload this file to your theme directory, and in your WordPress dashboard go to “Write -> Page”. On the right hand side you’ll see “page template” as in the image example here. Just select “Master Archives Page”. I’m going to call mine “Archived Posts Sitemap”. I like that title because it says it’s an archive page with a sitemap. To me a sitemap is a great big categorized page of titles and links where you can get a the big picture of a site pretty quickly. That’s the impression I want to give people, unlike the monthly archive pages that just list posts and excerpts. The first time creating this page I’m not going to give it much content – just some introductory content. Save this page and then reload your site in another tab or window. You should see the name of this new page in your “Pages” in your sidebar. Click on it to bring it up and you should have something like this:

You see in that example what you get is a listing of archives by month, and also by subject (category). This really sucks doesn’t it!? I mean come on, everyone already has both of these already in their sidebar – I do! There are basically two different ways to solve this problem, and actually these solutions can be combined. The first thing we can do is get a WordPress plugin for archives to get more options on this page. The second is to do a little hackng and add some code to the page to get the information out of the database we need to make sure visitor’s get all the options they need.

After reviewing my options – these are my thoughts…

I “could” use yesterday’s query_posts hack to list every post I have on the page – but that wouldn’t be very nice visually at all. I think it would be great to give visitor’s most “most viewed” or “most popular” posts on this page. I already have the most viewed top 10 in my sidebar. I use the Lester Chan Plugin WP-PostViews to get this. It will display the most viewed posts, or most viewed posts for a category. I’m going to use it to display the top 25 most viewed posts. That’s more than I have in my sidebar and should be very useful to visitor’s. According to the WP_PostViews documentation all I need to do is add this code “outside the loop” of my archives.php to add this to my Master Archives Index Page (since I already ahve WP_PostViews installed as a plugin in my WordPress installation):

<h2>Top 25 Most Viewed Posts</h2>
<?php if (function_exists('get_most_viewed')): ?>
   <?php get_most_viewed('both', 25) ?>
<?php endif; ?>
<br /><br />

Since you have to use that code outside the loop, and I have a page heading just inside the loop on my archives.php, I decided to place this after the loop in my Master Archives Index page. Another way to do this you might care for is by using the using the Top Post plugin by JohnTP to display the top post by category like he does on his top posts page. I decided to stick with what I have so far.

Doing a little more research I found two very similar WordPress Archiving Plugins, SRG Clean Archives, and Smart Archives. They basically do the same thing, just formatted a little differently.

Here’s a clean archives example where you’ll see that you get monthly archives with linked titles and post counts. It also shows the day posted before and comment count after each linked title.

In the Smart Archives plugin example you’ll see an addition of a linked calendar above the posts by year and month. The posts are also listed by month. With this plugin you don’t get date posted or comment count.

In the end I wanted to go with something I thought was not only a bit more cool, but much more user-friedly. I really wanted to use Exended Live Archive because of the interface, but it’s not compatible with WordPress 2.3+ at all.

In the end I went with KG Archives for my Master Archives Index page because it has a handy drop down at the top where visitor’s can quickly choose to see one month or all months quickly of archived posts. In addition this post lists the date posted and comment count for each as well.

To place the KG Archives content on your Master Archive Index Page you just have to copy and paste the following code – but this time go back and “edit” your actual “page” in “Manage->Pages” where you wrote the intro content, and paste this beneath (in code view):

<kgarchives initialmonth="current" />

I removed the original code I added at the beginning of this hack tutorial to get archives by month or subject in favor of the KG Archives sortable archive code. Based on all the options I presented to you in this post – you must decide which of all the layouts and plugins you like best for your archives index page. View my new Archived Posts Sitemap page here!

There are many other options in the readme file if you download this plugin, I chose to only display the current month at first. Now I have a Master Archive Index Page where users can navigate all my past posts quickly and easily. They can even see all posts on one page if they choose. I’ve also listed my most popular posts. If I keep adding pages, I may also expand my Archive Index to include a listing of all my parent and child pages at the very bottom. Create your own archive index now! I gave you plenty of options, and as always if you have something to add or a question – please comment now!

This is the very first post in the 30 WordPress Hacks in 30 Days Series!

If you use WordPress – then this is a series you will want to bookmark right now! You might even want to subscribe by email at the top of the page. If you’re like me your sick and tired of googling the crap out of the web trying to find easy ways to hack and customize your WordPress blog or web site. I’m going to give you a very useful and easy to perform WordPress hack every day for a month! I think that it’s easier to do something like this than write a humongous post with more information than you’ll never read or digest in one sitting. Instead I’m going to give you one very simple and easy task to do each and every day. Depending on your skill level, you may or may not want to take a look at last week’s post How to Create Your Own WordPress Theme.

WordPress Hack #1 – query_posts

Today in our very first WordPress Hack in our 30-day “Hack-a-thon” we’re going to learn about the WordPress “template tag” query_posts. You can read about query_posts in the WordPress Codex here. To use any of these examples you must place the PHP code snippet before “the loop”. If you don’t know what “the loop” is, just follow the link in the previous paragraph to create your own wordpress theme for an explanation. Each and every code snippet can used any any page that uses “the loop”, such as your index.php, category.php, archive.php, tag.php, or search.php.

Exclude posts that belong to a category

Maybe you don’t want posts from a certain category showing up on your index or another archive page. You could even use this to keep certain categories from showing in search results if you needed to. You need to know your category “ID” to do this, just retrieve it from your dashboard under “Manage->Categories”, and the “-1″ with your category ID# like this…

<?php
query_posts('cat=-1');
?>

You can exclude multple categories like this…

<?php
      query_posts("cat=-1,-2,-3");
?>

Retrieve a Post or Page

To retrieve a particular post you can either call it by ID (listed in your dashboard) or it’s slug like this (use one line of code or the other, not both)…

<?php
query_posts('p=1'); //using post id
query_posts('name=first-post'); //using post slug
?>

You can do the same thing to retrieve pages as well like this…

<?php
query_posts('page_id=7'); //retrieves page 7 only
query_posts('pagename=about'); //retrieves the about page only
?>

When you use those examples it retrieves the entire post. When you are notorious for writing extremely long posts (like I am) you may only want to get a partial post with the “read more” link. This is especialy useful if you’re going ot feature certain posts on your index or other pages. Here’s the code for that…

<?php
query_posts('p=5'); //get post with id of 5
global $more;
$more = 0; //gets partial post with read more link
?>

You know that you can create pages, and you can also create “child pages” like I have on ths site. I have a parent page called “series”, and then all the individual series index pages are children of that page. If you want to get a child page – that’s possible as well, but you can’t call it by id – you have to call it by double-slug as in the example below (parent slug slash child slug).

<?php
query_posts('pagename=parent/child');
?>

Retrieve Post by Certain Authors

If your blog has multiple authors you can retrive them by name or author id like this…

<?php
query_posts('author_name=John');
query_posts('author=3');
?>

Retrieve Every Single Post
Maybe you want to make some kind of an archive page or sitemap. Whether or not you create a page with this query of course depends on how many posts you really have, but inserting this code before the loop will list ever post you have all on one page. While the code below shows all posts on one page, you can change the “-1″ to just 1 post, or 5, or 10, or however many posts you want to display.

<?php
query_posts('posts_per_page=-1');
?>

Change the Order or Sequence of Posts
By default a WordPress blog shows you posts in a journal fashion or reverse date order. You could choose to instead sort your posts by author or title like this. You could use either the author or title lines.

<?php
query_posts('orderby=author');
query_posts('orderby=title');
?>

Using “orderby” there are many different parameters that you can use like these…

* orderby=author
* orderby=date
* orderby=category
* orderby=title
* orderby=modified
* orderby=menu_order
* orderby=parent
* orderby=ID
* orderby=rand

Retrieve a Post by Time Period

There are many different ways to consruct a query to retrieve certain posts based by date only. Here’s a way to get them for a day of the month…

<?php
query_posts('day=15'); //all posts on the 15th
?>

You could also get them for the current month and year with a query like this…

<?php $current_month = date('m'); ?>
<?php $current_year = date('Y'); ?>

<?php query_posts("cat=22&year=$current_year&monthnum=$current_month&order=ASC"); ?>

Retrieve Posts based on Tags
You can retrieve posts for a specific tag or tags like this (use one line of code at a time only). The first line retrieves posts with a particular tag, the second line is the format for getting posts for multiple tags, but the third line is for getting posts that were tagged in multiple categories. In other words the second line will retrieve all posts tagged as bread all posts tagged as baking. But the third line will get only posts tagged in bread and baking and recipe.

<?php
query_posts('tag=cooking');
query_posts('tag=bread,baking');
query_posts('tag=bread+baking+recipe');
?>

I hope this helps you do a little WordPress “theme hacking” and customize your blog. If you have any questions about query_posts please comment now, and we’ll see your tomorrow for the next hack!

By creating custom WordPress category template (or tag template) pages in your theme, you can boost SEO significantly, better monetize your pages, and ensure good search placement and indexing for all category pages. Without them, you are probably hurting your web site and losing money – and maybe even having duplicate content issues. I’m going to show you why these pages are so important and how to create your own descriptive content rich category index template pages in WordPress!

**UPDATE April 2008**
If you look at the very first comment at the bottom of this tutorial you’ll see that Charles asks a great question – “How do I make a WordPress tag template page?” It’s so similar to a category template page (and has the same search engine indexing benefits) that I’ve updated this page to include how to create tag template pages for your WordPress blog as well. This greatly increases the amount of pages you can have indexed in the search engines! Tags have only been around since WordPress 2.3, but their use is spreading quickly – and you should make use of them as well!

This post is now installment #3 of the Managing WordPress More Effectively Series, showing you unique ways to get the most out of your content and your WordPress blog or web site.

Looking at the millions and millions of WordPress blogs out there, it’s not hard to see that most people don’t customize their theme at all. Granted WordPress is pretty good at SEO out of the box in a default install, and you can use a plugins to help with SEO too – such as All in one SEO pack, or (the one I use) wpSEO. You would be surprised (if you aren’t already) how easy it is to hack and customize your WordPress theme to not only make your web site more your own – but make it EVEN MORE search engine and crawler friendly. This leads to better google (Yahoo! and MSN) placement, more traffic, more visitors – and hopefully more money for you!!

Let’s talk for a second about the default WordPress category pages and WordPress tag pages. First of all, when you publish WP posts you should have some “bins” to place them in – as if you were filing paperwork, putting away books, or your CD collection. CD collection is a good analogy because you have genre’s like rock, and country, classical, blues, rap, etc. These would be your ‘categories’. But “Van Halen”, or “Eddie Van Halen” would be a “tag“. Some people use their categories “as tags” and end up with dozens and dozens of them. I’m a victim of this myself, and to take advantage of what I’m about to teach you – you shouldn’t have a zillion categories set up. If you do that’s not such a bad thing as much as it will take a very long time to create template pages for each and every category you have. In addition, you have the ability to create custom tag pages as well, and if you have created a lot of tags over time for all your WordPress posts you could have a lot of potential custom tag pages to create.

Every category you create in WordPress creates it’s own “category” page – which lists posts that were filed in that category. By default each WP category page has the same header, sidebar(s), and footer, and the content of the page are the first so many words or sentences of the posts filed there. So while the category page is a great way to categorize content – there isn’t anything significant to this page to a search engine or crawler. It’s just a bunch of snippets (or full posts depending on how you have your options setup) matching other full pages on content on your site. On this site I have 23 categories (and that’s probably too many). As of this writing, I have 6 posts in the “wordpress seo” category. The only shot I have at someone knowing that my site has articles on wordpress seo is if one of those 6 pages somehow come up in a search. Be default all category pages are simply www.yoursite.com/category/category-name-here. Looking at www.jtpratt.com/category/wordpress-seo I see that only one article even uses the words “wordpress seo” in it’s title. If I were selling “wordpress seo” as a product – I’d be doing a pretty poor job, wouldn’t I?

Tag pages pretty much work the same way. I haven’t used tags much on this site (yet), but when you add tags to your posts a page is created for each tag as www.yoursite.com/tag/tag-name. All the tags you added give you the ability to create many customized pages for the search engine crawlers to eat up. The ability to “tag” your posts in WordPress has only been around since version 2.3+. Before WordPress 2.3 you could only tag posts if you had installed a plugin to do it. The thing that was weird about about tags with WordPress version 2.3 was that even though you had the ability to tag posts – there was absolutely no way to manage them at all. You couldn’t rename them, delete them, or anything – WP 2.3 provided now way to manage tags at all. This WordPress support page on tags reveals that WordPress coders provided no way to manage tags because they didn’t know what people wanted. If you’ve not yet upgraded to WordPress 2.5 – you’ll need to download and install the Advanced Tag Entry Plugin to manage your tags. Be advised, this plugin won’t work with WP 2.5 or anything before 2.3. It’s only good for the 2.3x series of WordPress installs. If you have WP 2.3 and have yet to upgrade to 2.5 this plugin will allow you to manage your tags so you can create tag template pages.

As much as I like the whole “blogging” paradigm – those of us that have been creating web sites for many years (12 years for me) remember when you build a static web site you would have an “index” page and “sub-index pages” for specific sections of the site. Those sub-index pages usually had a great description of what that part of the site was about and they usually got indexed as well (sometimes better) than your own homepage. In WordPress by default – a “category page” with only post snippets doesn’t have a fighting chance at a good search result listing for your blog.

You can find out how badly you’re hurting yourself right now by doing a google search. Just type in only the name of your domain for the search like this: www.jtpratt.com. Here’s an example of mine…

Do you notice something here? My homepage shows up, and then one post page – and that’s it! If fact if you do a “site:www.jtpratt.com” search you’ll find that I only have 33 pages indexed at all – and they’re all post pages! First off – category pages could cause you issues with google and “duplicate content” normally because there isn’t anything significant on them (content wise). The two plugins that I mentioned earlier for SEO have options to “eliminate duplicate content” (wpSEO has a checkbox), and when that’s enabled it placed this meta tag on your category pages:

<meta name="robots" content="noindex, follow" />

This tells the search crawler to NOT index your category page, but move on to other pages in your site. Now I know WHY my category pages weren’t indexed, but if the WERE (in their current state) it would have hurt me anyway. Google would have listed them, but under that little message it loves to give – something that looks a little bit like this:

Now that I’ve explained all this – down to brass tacks: How to Create Your Own Content Rich Category and Tag Index Pages and Templates in WordPress!

You would be surprised how much information is documented about WordPress – the details on how to create your own category template and tag template pages are fully available on the Category Template documentation page and Tag Templage documentation page in online WordPress Codex. It’s very simple.

When wordpress builds a category page, it has to “figure-out” which template theme file to use. The order it looks for them is like this:

1. category-6.php
2. category.php
3. archive.php
4. index.php

When wordpress builds a tag page, it has to “figure-out” which tag theme file to use. The order it looks for them is like this:

1. tag-slug.php
2. tag.php
3. archive.php
4. index.php

These files are part of your WordPress “theme” and more than likely you already have 2, 3, and 4. Some (very few) themes may have only 3 and 4. But I’ve never – EVER seen a theme (and I’ve used and installed hundreds) a theme that contained #1. What is this #1 file and what makes it so special? By default WordPress uses one theme file (category.php or tag.php or archive.php) for all category and tag pages. That means, even if you added some description text to category.php or tag.php – it would display on ALL your category or tag pages. You want to be able to add custom content to every category page you have – like “sub-index” pages in your site. The first thing you need to know is the WordPress ID# of YOUR categories and the names of your tag “slugs”. In your WP Dashboard go to Manage -> Categories. You should see something like this:

Every category you have has an ID#. Print that page out or write them down. You can’t do this next part within your WordPress install, to create these category pages you must have access to your web site in FTP, and download your current category.php from your theme directory. Then all you need to do is save it for each category that you have. The first one I have listed is category #18, so I would open category.php on my local PC and “save as” category-18.php”. You want to “save as” for each and every category number that you have. Then upload them to your web site in your theme directory.

For your tags you need to know the names of your slugs. WordPress 2.5 has the ability for you to manage your tags, if you’re using WordPress 2.3 you’ll need to follow my earlier directions to install a plugin to do that so you can get your tag (slug) names. If you have a tag page (tag.php) in your theme directory, download it now. If you don’t have one then download your archive.php file. Rename it to “tag-slug.php”, meaning that if the name of your tag was “wordpress-hacks” then you would name your file “tag-wordpress-hacks.php”. Now upload it back to your theme directory.

Next, open your WP Dashboard again and go to Presentation -> Theme Editor. Under your theme file pages listed on the right will (now) be the category page and tag page you just created. Click on one to open it up for editing. Remember that the WordPress category and tag pages also use “the loop”, which basically means it’s going to cycle through a sequence of code over and over again for every post listed in that category. You want to add content to these category template pages, but you want to add it before or after the post – you don’t want to repeat it again and again for every post.

Find the following two lines in the top of your template:

<?php /* If this is a category archive */ if (is_category()) { ?>
		<h2 class="pagetitle">Posts filed under '<?php echo single_cat_title(); ?>' </h2>

Just add a div with your content right after that like this:

<div> This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content. This is my sample content.
</div>

If you want to add some content below your posts, add another div right after these lines near the bottom:

	<?php else : ?>

		<h2 class="center">Not Found</h2>
		<?php include (TEMPLATEPATH . '/searchform.php'); ?>

	<?php endif; ?>

I’ve only created one template page so far (I’m doing the rest in the next few days), and it’s just a sample – you can see the descriptive text at the top of the page on my blog content page. I shouldn’t have to tell you what a new world this opens up for you! Now you can add multiple paragraphs of descriptive content on EVERY category page and (if my SEO WP plugins don’t nofollow them) I can get each category and tag page indexed in google as a “sub-index” or sub-home page of my site. If you have clients with products and services, how much easier will this make it to market their sites using WordPress? All your important pages can have specific information targeting particular keywords drawing new visitor’s right to it like flypaper. Now you almost have something like regular “static” pages in your site that won’t change once initially setup, in addition dynamic posts and blog pages! You have the best of both worlds between a static site and blog.

You can now monetize your site better by placing category or tag specific ads, and if you really needed to with a few minor hacks you could have category and tag specific sidebars as well! If you used the Ad Rotator plugin (I’ll talk about this in a future post), you could have category specific ads rotating in blocks before and after your content on those page, or even “in the loop” with one category specific ad in between each post! The possibilities are endless!

If you benefited from this post, have questions, or something to add to make it even better – please comment now!

“My blog is a failure” and I think I’ll just go somewhere and put myself out of my misery…having similar thoughts? Maybe I can help.

Last weekend I read post on another blog that really concerned me. The author wrote “I’ve been working at this blogging thing for more than a year and I haven’t really made any money and I don’t get many visitors and I am a miserable failure. “My blog is a failure” and I think I’ll just go somewhere and put myself out of my misery… That’s about one of the most extreme posts I’ve read, and that person has pretty much just given up. Have you evern been at the end of your rope with your blog? You’re not getting any comments, you don’t get many visits, you’re not making any money, you don’t know what to post about, you’re not meeting your goals – maybe you don’t even have any goals yet! You are thinking about the success you once dreamed of as a blogger and you’re now thinking of yourself as a failure.

That post I read resonated with me because I’ve been at crossroads like this before myself. Time and time again I was ready to quite because I didn’t think I was getting anywhere. In the back of my head I always remembered something Shoemoney wrote on his blog. It was about people having the perception that he was some kind of “overnight sensation” raking in tens of thousands on his site with ringtones. He pointed out that the first two years he tried to make money online me made nothing. Not a single penny. He even got fired from his day job for working on his ringtone site at work (that wasn’t making any money yet).

Success is never overnight. Success is a learning process, and with blogging it’s “learn as you go”. I think of Stevie Ray Vaughan who rose to fame in 1981 with his first album and hit single “Pride and Joy”. His success seemed overnight. Most had no idea he was born in 1954 and had been playing since the age of twelve. From 1970-1980 he played, and played, and played, and played on stage some more perfecting his craft. It’s not to say that he didn’t have true natural talent. But his incessant passion for music and refusal to give up on his dreams and goals drove him to never give up and press on. The fact that he did nothing but eat, sleep, and breathe his craft for more than a decade while practically living as a vagrant made him into the talent that he was.

I’m not saying you need to blog for 10 years without making money or being successful in any way, but you need to be realistic about what it is that you expect. I put this blog online in June 2007. I am thankful for the growth I’ve had so far in the last 10 months and look forward to the next year. I by no means think that I’m a huge blogger (yet). I do think I’m in a position to tell you about what I’ve experienced so far, and maybe it will help you.

This is page 1 of 4 – use the Navigation below to go to the next page…

Have you ever wanted to create your own custom wordpress theme? I’ll show you how to start learning to hack away at your own WP theme in this tutorial in just a matter of minutes…

This is the second installment in the Managing WordPress More Effectively Series – so you can get control of your blog and wring every last bit out of your content and visitors, saving you time and making you more money!

If you’re a regular reader of this blog, you might notice that JTPratt’s Blogging Mistakes now has a new theme! I think that a blog grows with the blogger, and the biggest mistake you can make is not modifying your blog to display your progress. I started out in 2007 with a really nice theme (Prosense), because it did most of what I wanted and looked professional. But I hacked and hacked and hacked it some more to slowly get rid of things I didn’t like. Finally – I just had to say enough is enough and create my own WordPress theme just exactly the way I wanted it.

WordPress Theme Hacking

If you’re curious and you know some HTML and CSS (even just enough to be dangerous) this guide was made for you. This isn’t a definitive guide or anything, but it will get you started and I’m sure it will give you some good ideas to create your own “custom WordPress theme”. This is the “How to Create Your Own WordPress Theme” tutorial, or “How to Hack WordPress Themes”. The first thing you need to do is get the Theme Test Drive plugin. I used this plugin for two weeks, so I could hack and test my new theme to death before putting it live. You see, it allows you to set a theme that only the admin will see when logged into the WordPress. So as long as you’re logged in, you will see the new custom theme you’re building but all your visitors will see the regular one.

Creating Your Own WP Theme from a Copy

Now login to your web site in FTP and download the theme you’re using now to your desktop. Give the folder a unique name like “custom-theme” or something. I’m going to show you how to create your own theme by starting to modify a second copy of the one you’re currently using (without anyone but you knowing about it). Now, using Notepad (or any text editor) open the “style.css” file. At the top of the file are some comment lines. When you go to “Presentation -> Themes” in your WordPress dashboard, the titles and descriptions of the themes you have installed come from the “style.css” file of those themes. The style file you just opened should already have comments like this as the first few lines like this:

/*
Theme Name: JTPratts Custom Theme
Theme URI: http://www.jtpratt.com
Description: No nonsense custom theme developed in house.
Author: JTPratt's Blogging Mistakes
Author URI: http://www.jtpratt.com

Modify all those lines with your own details, delete the “screenshot.png” file from the folder, and then upload the entire folder back to your theme directory in FTP. If you have a graphics editor, you could instead open the screenshot file and modify it to go with your theme. I created a custom one so I could tell my backup from my live one like this:

Once you’ve uploaded the folder to your theme directory, go back to your WP dashboard and “Presentation -> Themes” tab. Your new theme should now be an option. If you also created a “screenshot.png” (it must be named exactly that) and uploaded it in the folder too – the new picture of your theme will show up as well as in my example above.

How to Test a WordPress Theme as Admin Only

Now, enable the “Theme Test Drive” plugin you downloaded and installed if you haven’t already. Go to “Presentation -> Theme Test drive”, choose your new theme from the dropdown and click the “enable” button.

That’s it – now your ready to start theme hacking! Go to the “Presentation -> Theme Editor” tab and in the drop down menu your “current” theme will be listed like this:

That’s my current theme everyone sees. Before I start editing the test theme only I will see as admin I need to switch to that one in the theme editor like this:

Now in the right hand list of files, find the one labeled “Main Index” and click on it. 10 or 20 lines in you should see something like this:

<div class="entry">
	<?php the_content('Read the rest of this entry &raquo;'); ?>
</div>

Right after the div entry tag add a bunch of random text, save the file, and in another tab or browser window load up your blog home page. Does it contain the random text? If it does – great! If not, go back and follow the directions again to see what you did wrong. Now I don’t know how much HTML and CSS code you know – so if you need a reference be sure to visit and bookmark W3Schools which is a free online resource for web coding. They have a reference page for each and every tag, and many free tutorials.

What is the “Wordpress Loop”?

Depending on how much HTML and CSS code you know (and are willing to mess with) now you remove the random text and start messing around with your theme. Remember – only you can see the changes (while you’re logged in as admin), and you can even make major changes to the sidebar, header, and footer. The code I just showed you is what puts the posts on the main page. Not the titles or meta information, just the post content itself. You home page (Main Index) contains a “loop”. It’s called the “Wordpress loop” because by default your Main Index shows 10 posts. The PHP code for the look basically says (in English) “once you find the first posts, do these things over and over until you reach the tenth post. So if you put something “in the loop” (like a picture or text) is would display on your Main Index page 10 times before or afer the content for each post beginning with the first until it reached the last.

I’m telling you this because if you want a graphic at the top of your page before the posts (like mine) you have to place it “before the loop”. If you want it after all the posts, like the 336×280 ad at the bottom of my Main Index page, it has to go “after the loop”. While EVERY theme is a bit different I this is what you look for:

<?php if (have_posts()) : ?>

<?php endwhile; ?>

The WordPress loop starts with the have_posts line and ends with the endwhile line. Before and after those 2 lines would be “before and after the loop”. Somewhere in between those 2 lines would be placing something “in the loop”. I wanted to explain this to you before you started hacking around and wondered why your changes showed up in weird place. For practice, try adding some kind of code or script for an ad (or just a linked image if you know the code) before or after the loop on your Main index page. If you’re new at this it’s good practice, and you should be figuring out why so many of us hack our theme by hand – it’s just impossible to have a plugin for every little modification you want to make.

Your First WordPress Theme Hack

Now I’m going to teach you your first real ‘hack’. Let’s say you want to show some kind of text, image, or ad further down your Main Index page, but not before or after “the loop” and not after all 10 posts. You have to insert a line of code to tell “the loop” to display it only once (and where)

<?php if ($count==2) { include('main-index-ad.php'); } ?>

    <?php $count = $count + 1; ?>

  <?php endwhile; ?>

The first line is the one you copy and paste into your Main Index file, put it before the count and endwhile lines just like in my example. That line of PHP code says to the loop (in English) “while you counting, after the second post print the contents of the main-index-ad.php file”. This means of course, you have to create a file called ‘main-index-ad.php’ (or whatever you want to call it) and add the script or code or whatever you want to put after the second post. Make the change in your Main Index file and “save”. Upload the main-index-ad.php file to your theme folder, and then reload your home page to test your very first theme hack. Did it work?

So far, we’ve been working on only the “Main Index” or index.php file for theme hacks. Although every theme is a bit different, nearly every one has a Main Index, a Single Post, a Page file, 404 Template (file not found), Sidebar (sometimes 2), Comments, and Archives page. Some themes also have a Category page, but if they don’t the Archives.php page will be used for category pages too. I point this out because if you ad something to the homepage, you might also want it to appear on single posts, or pages, or category pages. Like in the previous example you might consider making several files with ads, text, or images and uploading them to your theme directory. You can use the same line of code in the previous example to include any file before or after the loop. Just remove the count statement like this:

<?php include('name-of-my-file.php'); ?>

It’s much smarter to add things to your pages with a file like this if it’s going to be in multiple places. Otherwise, you have to manually modify multiple files. If you do it like this, in the future when you need to change that content, you just edit the one file.

Your Second WordPress Theme Hack

For quite a while I had wanted to add the comment count under my post titles on my index page where they would be linked to actually post a comment. Oh – an I wanted a little comment graphic beside them too. Basically “inside the loop” you just add the following PHP code somewhere are your post title:

<h2></h2>

<?php $comments_img_link= '<img src="/wp-content/images/comments-icon.gif"  title="comments" alt="comments" />';
comments_popup_link($comments_img_link .' Comments(0)', $comments_img_link .' Comments(1)', $comments_img_link . '  Comments(%)');?>

There’s still a few things that WordPress “won’t do” what I prefer to have on my blog that are easily added with a plugin. For most of these things I use Lester Chan’s WordPress Plugins. I use WP-PageNavi for the navigation at the bottom of my home page, and replaced the horrible “previous” and “next” default wordpress navigation links with it. I use WP-PostRatings for the star voting on each post. WP-Post Views displays the post count for each post, in addition to the “most viewed” posts in my sidebar. The WP-Print plugin is for the printer friendly page link for posts. With all these Lester Chan WordPress plugins, once you install and activate them, all you have to do is copy and paste the line of PHP code on the pages and places you want the plugin to display something. You get that code on the documentation “usage” page for each plugin on Lester’s site. After doing the first two hacks, it should be pretty easy to add the code to your template pages for the plugin hacks to work.

In addition to the Lester Chan plugins, on my pages after the posts on my main page you’ll see some options for visitor’s like “subscribe to this feed”, “email this”, “digg this”, etc. These features actually come from Feedburner. I know on a lot sites I see people adding a “social” plugin to display a bazillion options for all the tagging sites. I use Feedburner for my feed (like most bloggers do), and they have a “Feedburner Feedsmith” plugin that will add that “flare” after your posts – which I think have much more helpful options than any social plugin around. If you download and enable that plugin from Feedburner, you have to add the provided PHP code to your template as well.

Hacking Your Theme Stylesheet

Your stylesheet contains all properties of all the colors and sizes of items on your blog. It has background and link colors, font sizes, bold, italics, you name it. In your dashboard theme editor click on “Stylesheet” to bring up this file. It’s the same one you added the theme properties to on your computer in a text editor at the very beginning of this article. YOUR stylesheet is more than likely going to be completely different than mine, and editing it won’t be as easy as the earlier copy and paste hacks. What you need to know is that every web page is a “document” that has “elements”. The elements are setup in a “box model”, and items like div’s, paragraphs (p’s), spans, the body, headings (h’s), blockquote, and list tags (ul, ol, li or underordered list, ordered list, and list) are all “boxes”. In CSS code everything “nests” and “properties” can be assigned to elements at any level. Here’s a diagram example:

That image is an example of how all the boxes would look if you drew them all out. Here’s how those boxes look as (well formatted) HTML code:

<body>
  <div>
	<p>
	  <ul>
		<li></li>
		<li></li>
		<li></li>
		<li></li>
	  </ul>
	</p>
  </div>
</body>

I wanted you to visualize this before you started stylesheet hacking so you would know about how nesting works. If you change the (font) “color” to grey at the “body” level all the text on the page will be grey. If you also change the font color to green at the “li” or list item level, all the text on the page will be grey except the list items, which will be green. If you change the paragraph or “p” font color to red, then both the P and UL text will be red, the LI text will be green, but the rest of the body and div text above those levels will still be grey. This is called “inheritance”, and properties start at the highest level and stay that property until changed lower down the nesting chain.

The first thing you might want to hack is your link colors and properties. There are sooooo many ways to change your links to make them stand out. A hyperlink is an “a” or anchor tag. There are 3 states of a link which are normal, visited, and hover. Normal is what the color of the link is before you click it. Visited is the color of the link once you’ve visited it. And hover is the color of the link when your mouse goes over it. For all three of these states of a link you can change the color, text-decoration, background, and many other properties. In my stylesheet I have entries to change link properties for the entire body of all my pages like this:

body a {
	color: #0033CC;
	text-decoration: none;
}

body a:visited {
        color: #003399;
}

body a:hover {
	text-decoration: underline;
        color: #003399;
	background: #000000;
}

As you see, you can change the color for the 3 different states of links, you can change the text decoration (for any state), or the background color (for any state). You can also leave any of these properties out. For the text decoration property you could use any of these values: solid, underline, overline, line-through, none, dotted, or dashed. While my code example above controls the link color for an entire body of a page, you can also change them at any level, like maybe your sidebar:

#sidebar a:hover {
	text-decoration: underline;
}

Experiment by modifying the link colors in your stylesheet now. Then experiment further by changing font sizes and colors. To find cool color schemes to change colors of text, links, or backgrounds Use this CSS color chart for reference. It’s probably the best color chart I’ve seen in years, mainly because it is based on pantone colors and paint strip samples from a hardware store.

The last wordpress theme hack (in this article) I’ll show you is for headings. A heading is an “H” tag like <H1> <H2> <H3> <H4>, etc. Every post should have a (title) heading, and every widget or section in your sidebar has a heading. As shown earlier in my diagram – a heading is a “box” and that box has properties, like background, padding, margin, (text) color, (link) color, border, border-style, and more. By default in WordPress the post headers are just linked text. While that’s ok, as you can see on my Main page and my post pages I prefer a black border, a background color, and some padding. In my sidebar I gave the sections headings a background image, a bottom border, and some margines. The list elements also have a bottom border.

#sidebar ul {
	margin-bottom:5px;
        padding-left:5px;
}

#sidebar .sidebar_left ul h2 {
	padding-bottom: 1px;
	border-bottom: solid 1px #999999;
	font-size: 1.1em;
}

#sidebar h2 {
	background: #B0E2FF  url('/wp-content/images/header-bkg.gif') no-repeat;
	padding-left: 7px;
	padding-bottom: 0px;
}

#sidebar .sidebar_right ul h2 {
	padding-bottom: 1px;
	border-bottom: solid 1px #999999;
	font-size: 1.1em;
}

In the code example above I showed you nearly all my sidebar stylesheet properties so you can get an idea of the many different ways you can customize a header and list item. You can see how I gave the sidebar H2 header a backround image instead of just a color. This the code I used to format the properties of the post headings:

.post h2 {
	background: #CCCCCC;
	border: 1px solid;
	border-color: #000000;
	padding-left: 10px;
	padding-right: 10px
}

Instead of just having linked text I gave my post headings a background color of grey, a solid 1 pixel black border, and some padding on the left and right sides. Now I think it’s much easier to see where one post ends an the next begins on my pages.

Use What You’ve Learned to Hack Your Theme More

I’ve give you a way to hack away at your WordPress theme without changing how your visitor’s see it. I’ve told you about the WordPress loop, and how to add things before, after, and inside it. We hacked and added some PHP code, and then hacked our theme stylesheet to change properties to affect the layout and design of the page. I can’t teach you everything you need to know to create your own entire custom theme in just one post – but I can get you started! Now you know enough about WordPress themes to be dangerous and customize your own. Visit and bookmark W3Schools.com for your HTML and CSS reference needs. Research and read more articles explaining how to hack and customize your WordPress theme further like the tutorials at WPDesigner.com.

Please comment if this article helped you, you had a question, or a great worpress theme hack or customization to add! I hope you found this information valuable – if so please feel free to bookmark, digg, and stumble this page!

Yesterday when I showed you How to add an Affiliate Store in 5 Minutes from a Data Feed, I showed you an incredible way to add a merchant’s entire product line (or specific categories) to your web site or blog. I mentioned that with the service that GoldenCAN.com offers there are three things you can create from a data feed (if the merchant offers it). The first two, product results, and coupon results I showed you how I implemented yesterday. The one I didn’t cover at that time was “Search Integration”. If you are like me (before I figured it out) you may not know what this is. Search integration is where your search results are supplemented by actual products from merchants you choose. If you set this up right – your search page will never have “no posts matched your criteria” and a bland page again. Users will get results EVERY time, and the beauty of this is – if a purchase is made, you’re going to get affiliate commissions for it. That’s right – I’m going to show you how to monetize your search results!

You could use the GoldenCAN.com fees to supplement seach results on any blogging platform – but my example to is for WordPress, because that’s what I use. I’m going to go through this step by step as I implement this “search results monetization” strategy on one of my main blogs. I got to thinking about about doing this because I was trying to figure out what people were searching for on my blog. Awhile back I installed a plugin called Psychic Search from MaxBlogPress. It quietly collects information about what people search for on your WordPress blog. When you install and activate this plugin, you can find results in your dashboard under “Dashboad -> Psychic Search” tab. There are two sections, one for searches, and one for searches with no result. The entire reason to have this plugin is to see what people are searching for “and not finding”.

In my example we see that there have been some searches in the last 7 days and last 30 days for keywors that yieled no result. Most of them are normal types of searches that relate to the site, but there are a couple that don’t at all (like “Britney Spears”). I think we can fix it where every single one of these have a result from now on – and there will never be an empty search results page again. In addition – we can even add products “in with” search that have results!

First you need an account at GoldenCAN.com. If you didn’t get one when you read yesterday’s post – get one now! Also, if you want to take full advantage of all GoldenCAN has to offer (if you don’t already have them) signup for accounts through all the affiliates their merchants use, which are Commission Junction, LinkShare, ShareASale, and DoubleClick Performics. Next login to GolenCAN.com and go to the “My Affiliate ID’s” link and add in all your account numbers for all of those services, so you won’t have to manually add them in again when creating stores. Now follow the “Merchants” link in the header nav. You get a page with active merchants – take a look at all the ones with a red star in front of it. These are all the merchant data feeds that are completely free. All the traffic you send to them when it yields you a sale (through CJ, ShareASale, LinkShare, or Performics) you get 100% commission. If the merchant is further down the list with no red star, then you giveaway 25% or every 4th click to use that merchant with this service. So note all the merchants that would work for you in supplemental search results on your site, and whether you want 100% free ones, or whether you want to include some of the “every 4th click” ones.

For the purposes of the search integration on my example site I’m going to use 4th click merchants, because (for that site) I think they’ll have more appropriate results. The blog I’m using for this tutorial is my gadget and technology geek blog The Smorgasbord.net. On the “Merchants” page I click on Amazon, because they have everything imaginable. They’re results should bring up results in books and music when nothing else appropriate comes up. Once you click on Amazon, the next page gives you 3 different “integration options” and choose “Search” integration.

On the next screen give your store a name and create the store. Then you will have the ability to choose from all the available stores goldenCAN has available (with search integration). Once again – the ones with red stars are completely free, and the ones without take every 4th click of your traffic.

I chose Amazon, HobbyTron, TheNerds.net, CompUSA, TigerDirect, and Circuit City – all geeky things. Then when I hit continue, I get page with all the required affiliate ID’s for the merchant’s I chose. If you entered these already before when I told you on the “My Affiliate ID” page all the fields should be populated. You can updated or edit anything you want now. I change all the “Sub ID” fields to something to note in tracking what site the clicks will be coming from. Then click “continue” again.

On the properties page you can change the font and colors, but the most important option is to turn off the “search box”, because it would be weird to have a search box in search results. It would work, but be very weird. Click “update” when you do this to upate the code.

Scroll down the page to the “Get Data PHP Code with Search Keyword” section. We’re going to use this code to supplement the search results in our WordPress blog.

Once you copy the code, paste it into Notepad or a text editor. On the third line, replace the two words “DVD Player” (leave the quotes there) with a dollar sign and a lower case s: $s

In a WordPress blog, the “keywords” that people type in the search box are store in the $s variable (in programming terms). You don’t need to know much about how this works or be a programmer at all, just replace DVD Player with $s and magically the keywords that people type in will be sent to GoldenCAN and bring back product results to integrate with your search results. So now, leave this page open in your text editor and go back to your browser. In your WordPress Dashboard go to the “Presentation -> Theme Editor” tab. On the right click on the “Search Results” link to bring up your search.php file from your theme in your WordPress dashboard for editing. Before you edit anything it would be a good idea to copy everything, and paste the entire page into (another page in your) text editor and save it as a backup copy! Now that you have a backup (in case you accidentally screw everything up), it’s save to edit the search results page. Go back to your first text editor page copy all the code you pasted in there and modified with the $s earlier.

Go back to your browser, and find this code in your search.php you have open:

    <div class="entrymeta"><img src="<?php bloginfo('template_url'); ?>/images/time.gif" border="0" alt="time" />
    Posted <?php the_time('F j, Y ');?>
              <?php $comments_img_link= '<img src="' . get_stylesheet_directory_uri() . '/images/comments.gif"  title="comments" alt="*" />';
			comments_popup_link($comments_img_link .' Comments(0)', $comments_img_link .' Comments(1)', $comments_img_link . '  Comments(%)');?>
          </div>
    <div class="entrybody">
      <?php the_content(__('Read more &raquo;'));?>
    </div>
    <p class="postmetadata">Filed under:&nbsp;<?php the_category(',') ?></p>

After that code paste in your GoldenCAN search integration code. EVERY theme is different, just be sure to add the code in after the post content and meta – just before the div closes. Just be sure to add it before the “endwhile” where the loop closes. You’re not done yet, next find this code:

  </div>
  <?php endwhile; else: ?>
  <p>
    <?php _e('Sorry, no posts matched your criteria.'); ?>
  </p>

  <?php endif; ?>
  <p>
    <?php posts_nav_link(' &#8212; ', __('&laquo; Previous Page'), __('Next Page &raquo;')); ?>
  </p>

paste the code in again there as well. We’re going to post it twice because the first time was so products will come up and be mixed between posts in search results. The second time was so products will display when there are no results. Now you just have to modify one thing, find this line again:

    <?php _e('Sorry, no posts matched your criteria.'); ?>

Change that line to indicate the products, I changed it to ‘Sorry, no posts matched your criteria – please try one of the following.’ Be sure to keep the single quotes intact and only modify the text. Now I’ll show you 2 examples of how this works in action.

The first example is products added within my search results. It shows book results from Amazon after post results:
Scientologists

The second example is a search with no results (in my blog) and just the newly added products. Previously this search yielded a completely blank page:
Britney Spears

How will all this work? I don’t know, I’m going to watch this over time and see how it does. Did I pick too many merchants and does it take too long to get the results back? Is the page too cluttered? Over time I’ll have to tweak and track this to see how I can make it work better. But for now – I’ve quickly monetized my search results, and never again should one of my visitor’s see a blank search result page. In addition – hopefully I’ll make money from my search results pages! This was incredibly easy to do, and even if you now nothing about programming – with just a very little HTML knowledge (almost none) you should be able to follow my examples above to copy and paste your way through this. Anyone can do it!

Do you have experience with data feeds or search results integration? Comment now!!

This tutorial shows how to create an affiliate store in 5 minutes from a data feed. This is an incredibly flexible alternative to BANS, PHPBay, BayRSS, Build a Niche Store, Amazon widgets, or anything else out there. I use ALL the things I just mentioned, but this is something new, something FREE, and something very, very customizable…

I’m about to show you something incredible that’s been under your (and my) nose all this time and you didn’t even know it. If you’ve been an eBay affiliate, or promoted affiliate programs through Commission Junction, ShareASale, or LinkShare you know how difficult it can be to link to individual products, create a landing page, or get links. Nobody wants to promote a banner anymore, as bloggers and niche marketers we need to promote “products”. It’s very frustrating knowing that a good merchant has thousands and thousands of quality products and you can’t directly link to them at all.

There is a solution, and it’s very, very easy to do – and it’s been under your nose all this time. You can have an entire affiliate store online in about 5 minutes, containing each and every product a merchant has. You can do it very little knowledge of code (some HTML helps), and you don’t need any special blogging software or plugin even. Your store will be completely searchable and all results will come up on your page within your domain – no iframes or crazy stuff. It will even be completely searchable (or not) if you want it to be by search engine spiders. I am shocked that the way to do this isn’t available directly through CJ, ShareASale, or LinkShare themselves.

All the big merchants (and some of the smaller ones) have a “data feed”. It’s a text file (usually XML or CSV) containing all the details of every product they sell. It has the titles, names, links, and descriptions of all products in their database. If you were a web programmer, you could request this data feed and build an incredible online store with it, inserting your affiliate ID in all the links. But you’re probably not a programmer…

Guess what – there’s a free service you can use where you won’t need a programmer. It cost nothing, and probably never will. I’m talking about GoldenCAN.com. Sign up and get an account RIGHT NOW! What happens is, once you have an account you can choose a merchant, enter your affiliate ID, and create an online store feed in seconds. They get every fourth click you generate from the feeds to pay for their expenses, unless you use one of the 30 merchant feeds where they foot the bill, and you get all the traffic. That’s right, if you use one of the 30+ starred feeds, the merchant pays for it so you don’t have to turn over every 4th click (or share any traffic at all). This means this entire service is FREE and cost absolutely nothing to you.

How to Add an Affiliate Data Feed in 5 Minutes

I was AMAZED at how quickly I setup an entire online store. It was so quick and dirty I was shocked, I am not lying – I had my first on online in less than 5 minutes.

First – Find a Merchant:
Choose one of the first 30+ merchants with free feeds.

Second – Create a Store:
Just give your store a name, add your affiliate ID from Commission Junction, ShareASale, or LinkShare, and create and enter a unique short identifier of your own to track sales.

Third – Set your Store Properties:
You can modify the categories you want to display within the store (or display everything), you can change the font and color properties, how many items to show on a page, whether you have search displayed, etc.

Fourth – Get your code and past into a simple web page:
You have many choices for inclusion in a web page. One is javascript (which search engines won’t index). If you don’t want your store indexed this is great. If you do – then you can use either PHP for Linux webhosting, or ASP for Windows webhosting. This code takes care of the entire store, including search, navigation, and all products. All you have to do is paste it into a web page (template) that you create which can be as simple or complex as you desire. At very least you should probably have some kind of footer, an intro paragraph of original content, and a footer – with navigation back to your site and a copyright.

Once you’ve created stores, they are listed within your “MyStores” page like this:

You can delete or duplicate your stores from here. This page also tracks how many pageviews and clicks your store(s) have generated. I created 5 different stores so far, and each one has been created in 5 minutes or less – you can view them all for examples if you wish:

eBags Coupons: This was the first one I created, which wasn’t a store, but a coupon page listing all current offers from eBays (updated live). When you create a store you have the ability to create store products, coupons, or search results integration page. I used the javascript option to add these to the page.

Guitar Store: This was the second one I made, and all I did was open a text editor and create a simple HTML file and add one header logo – and I copied and pasted the PHP code from goldenCAN in the middle of the page like this:

<html>
<head>
<title>Instrument Pro Guitars |Guitar Review</title>
</head>
<body>

<div align="center" width="100%"><img src="/wp-content/themes/blackcrunch/images/logo.jpg" alt="Guitar Review"></div>

<?php
$SID="C4B047AF-543F-4252-A616-951CD30F4D14";
$IPAddress = urlencode($_SERVER['REMOTE_ADDR']);
$UserAgent = urlencode($_SERVER['HTTP_USER_AGENT']);
$Host=urlencode($_SERVER['HTTP_HOST']);
$PageURL=urlencode($_SERVER['SCRIPT_NAME'].'?'.$_SERVER['QUERY_STRING']);
$URL="http://si.goldencan.com/GetData.aspx?ver=2.0&SID=".$SID;
$URL=$URL.'&Host='.$Host;
$URL = $URL.'&PageURL='.$PageURL;
$URL = $URL.'&IPAddress='.$IPAddress;
$URL = $URL.'&UserAgent='.$UserAgent;
include($URL);
?>

</body>
</html>

Computer Closeouts
Computer Overstocks
Both of these I used the same basic HTML page, but this time I added a paragraph of original content at the top of the page for each for better indexing.

Refurb LCD HDTV: on this one I made named the PHP file with keywords for better indexing.

If you really thing about it – you could create these affiliate stores from data feeds and make your own custom headers, and footers and treat them like BANS sites. You could write original articles and promote them, monetize them with other ads or adsense, or even include the feed in your blog. Promoting feeds with these data feeds could become a good “free BANS alternative“. And you didn’t know there could be an “alternative to Build a Niche Store” – did you? Let alone completely customizable and completely free!