How I "activate" a review

I alluded to it in last tuesdays podcast with Dougal Campbell: When I add a custom field "rating" to a post, my theme now automatically marks up that post as an hreview microformat. So it's as simple as this:

The rating is between 0 and 5, because that way Google understands it best and we don't have to give Google any extra metadata about it.

The hreview_echo function

To make this whole process easy, I've created a function in my functions.php file called hreview_echo. It looks like this:

function hreview_echo($val) {
  global $post;
  $rating = get_post_meta($post->ID, 'rating', true);
  if ($rating) {
    echo $val;
  }
}

We'll use this function on the several places where we need to add extra classes to make up the hreview.

The wrapper class: hreview

The first class we should add is the wrapper for the entire microformat: the hreview class. This should be on the div surrounding the post (this div should include the title and author). In the default theme (and in mine) it looks like this:

<div <?php post_class() ?> id="post-<?php the_ID(); ?>">

In this case the class of this div is actually put out by the WordPress core post_class() function, so we'll need to hook into that function. Luckily it allows us to easily do that using a filter, which we'll do using the functions below, which you can drop into your functions.php too:

function hreview_post_class($classes, $class, $post_id) {
  global $post;
  $review = get_post_meta($post->ID, 'rating', true);
  if ($review) {
    $classes[] = 'hreview';
  }
  return $classes;
}
add_filter('post_class','hreview_post_class',10,3);

If your theme doesn't use the post_class() function, it's even easier! Let's say your post div looks like this:

<div class="post">

You can just use our hreview_echo() function:

<div class="post<?php hreview_echo(' hreview'); ?>">

The item reviewed: the title

Next up in the line of things we have to add a class to is the post title, it needs two classnames: the item and fn classes. In my case it looked like this:

<h1><?php the_title();?></h1>

This is easily turned into the following, again using the hreview_echo function we created before:

<h1 <?php hreview_echo(' class="item fn"'); ?>><?php the_title();?></h1>

The date of the review

For the date we'll have to work it a bit. The hreview microformat determines the date should be in ISO date format. Meaning the date should look like: 2010-03-01. Your theme probably has another way of showing the date, I know mine does. My date looked like this:

<span class="date"><?php the_time('d F Y');?></span>

Now to make it so that it can still look like that but we can also give the microformat the correctly formatted date, we'll use a trick: by adding a span with a class of value-title and then adding the correct date in the title of that span, microformat parsers will ignore the other content and pick the value from that title.

So we'll turn it into this:

<span class="date<?php hreview_echo(' dtreviewed') ?>">
  <?php
      hreview_echo('<span class="value-title" title="'.
        get_the_time('Y-m-d').'"/>');
      the_time('d F Y');
  ?>
</span>

This outputs:

<span class="date dtreviewed">
  <span class="value-title" title="2010-02-10"/>
  10 February 2010
</span>

That's a nice, non-intrusive solution, right?

The reviewer: the author

The next class we need to add is the reviewer class, as this is the author of the review, that's a simple one too: it's the author of the post. In my theme, my author block looks like this:

<span class="author"><?php the_author(); ?></span>

Now you'll get by now what we'll do:

<span class="author<?php hreview_echo(' reviewer'); ?>">
  <?php the_author(); ?>
</span>

Easy does it, right? You can basically do something like this with any kind of showing the author's name. Other functions that might be used in your theme are for instance the_author_link() or the_author_posts_link().

The content of the review

We've done more than half of it now! Let's get going with the contents of the review, in the microformat, this needs the class description. In my theme, just like in the default kubrick theme, the content is wrapped in the following div:

<div class="entry">

You've guessed it by now haven't you? Here we go:

<div class="entry<?php hreview_echo(' description'); ?>">

By the way: if you want to mark up articles on for instance your fronpage as hreview too, and you use excerpts there instead of full articles, like I do, you should use summary, instead of description:

<div class="entry<?php hreview_echo(' summary'); ?>">

Finally: the rating!

And now, finally, it's time for us to add the rating, because that's what it's all about right? There's all sorts of ways to display a rating, I have chosen to do it in HTML that looks like this:

<div class="rating">My rating:</div>
<div title="4.5 out of 5 stars" class="rating_bar">
  <div style="width:90%"></div>
</div>

Which outputs this:

The second div (class rating_bar) displays the rating, and it contains the empty stars. The div within that contains the yellow stars, and fills the stars up to where they need to be.

The CSS for these 3 divs looks like this:

.rating {
  float: left;
  margin-right: 10px;
}
.rating_bar {
  float: left;
  width: 55px;
  background: url(images/stars.gif) 0 0 repeat-x;
}
.rating_bar div {
  height: 12px;
  background: url(images/stars.gif) 0 -13px repeat-x;
}

Download the (sprited) image of the stars here.

Now we'll need to do two things: dynamically output the size of the inner div within rating_bar, and make the rating readable for a microformat parser.

To display the rating, because it's a value between 0 and 5, we'll multiply it by 20. To make the output parseable by a microformat parser, we'll use the same value-title trick we used before. Finally, we'll turn this all into a function to display the rating, which you can drop into your functions.php, just like the two functions before.

<?php
function display_hreview_rating() {
  global $post;
  $rating = get_post_meta($post->ID, 'rating', true);
  if ($rating) {
?>
    <div class="rating">
      My rating:
      <span class="value-title" title="<?php echo $rating; ?>"/>
    </span></div>
    <div title="<?php echo $rating; ?> out of 5 stars" class="rating_bar">
      <div style="width:<?php echo ($rating*20); ?>%"></div>
    </div>
<?php
  }
  return $output;
}
?>

So, now you can just use the display_hreview_rating() function anywhere in your post where you want to display the rating. If there is no rating, it won't display anything.

Testing your hreview

Testing your hreview markup can be done with multiple tools, but I myself found the Google Rich Snippets tool to be extremely useful. If you use Quix, just type 'snippet' on the post you want to test! In my case it outputs a snippet like this for my review of a WordPress backup plugin:

Bonus: pricerange and tags

As you can see in the above snippet, it includes something that is not documented anywhere in the official Google documentation for reviews, but that Google does support: the pricerange.

Credit where credit is due: I first found this pricerange attribute when my colleague Eduard pointed me to this post by the SEOgadget guys, which pointed to this Knol. It's extremely useful and seems to basically allow for all sorts of text. People use it to display a pricerange in a €€ - €€€ style, or to display a "real" pricerange, like € 100 - € 150. In case of an individual review, you can just use it to tell what you paid for it.

Since what I paid for a product is not a real part of my theme, I just make it simple: when I tell that the plugin is free, I mark up that line as:

this plugin is completely <span class="pricerange">free</span>

If you do want to put the value into a custom field and display it, you could easily adapt one of the functions above to do that, I'll leave that as an exercise to you, the reader.

Another thing I found that Google recognizes is the class tags. That's really easy to do: I just added the class 'tags' around my tags. I don't know how Google uses that though, haven't seen it anywhere in the wild.

A final note

If you've modified your theme to mark up as hreview, please make sure to use this form to let Google know that you have. They might not show it if you don't fit their test segment though, because as Google states in the Knol:

Currently, review sites and social networking/people profile sites are eligible. We plan to expand Rich Snippets to other types of content in the future.

I hope you've found this post useful, let me know in the comments if you've used it to add hreview to your (premium) theme, and feel free to post links to examples, I'd love to see them! If you're wondering: all code examples on this site, unless specifically otherwise stated, are MIT licensed: free to distribute, free to modify. Please do add a link to where you got the original code though.

It's my humble opinion that additions like these should make it into all the premium themes, because that's what really makes a premium theme premium, in my opinion. Happy coding!

Implementing hreview in your WordPress theme is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Google FriendConnect API is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Matt Cutts has just announced a new tag at SMX West Google, Yahoo and Microsoft have just announced a new tag, which we can use to tell the search engines which URL it should have for the current page. This is probably best explained with an example, so here goes.

Suppose you have read my Twitter Analytics post, and you've started tagging all the URL's you spread on Twitter with Google Analytics campaign variables. So at some point, Google enters your site through this URL:

http://yoast.com/twitter-analytics/?utm_source=twitter&utm_medium=twitter
&utm_campaign=twitter

If it did, in "old times", this would mean you'd have a duplicate content issue: the same content indexed under two different URL's. An issue SEO's have been trying to solve on web pages for ages, which sometimes created huge limitations. This is where the new tag comes in. You add this code to the <head> section of your page:

<link rel="canonical" href="http://yoast.com/twitter/analytics/"/>

And now, Google will suddenly count the links it has seen to that campaign tagged URL, towards the canonical URL, and not index the campaign tagged URL anymore. Simple, yet effective. Cool huh?

Disclaimer: this tag is only a "hint" to the search engine. While they'll probably use it 99% of the time, they reserve the right to handle things any way they want, in case of errors etc.

Of course this isn't just useful for campaign tagging. Many a webshop needs the URL to store sort variables, for instance. But a page that's sorted by price ascending, is often almost the same as a page sorted by price descending.

Now I have to admit I had a bit (like a couple of days) of a headstart on this one, so I can now make it easy for you if you're running WordPress, as I've got a Canonical URL plugin ready for you!

Also, if you're using Magento E-Commerce, I've collaborated with Joachim Houtman to make this Magento canonical URL's extension for you, that does this for you in Magento!

Working with Marek Sotak, we've also developed a module for Drupal that does this, by modifying the global redirect module. Grab it here. Note: this is not an official release of this module, we'll do that soon.

If you've written a plugin or extension for another open source system that does this, or would like to work with me on doing so, let me know in the comments!

Canonical URL links is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Basically, this is Google offering me, the user, to translate the search term into english. When you click this link, you'll get a SERP for "flight amsterdam", where it shows the SERP translated in German on the left, and the original SERP on the right (click for enlargement):

I'm curious as to how Google decides to put this in... I'll be trying to figure out with our analytics staff here how many traffic we get off of these translated searches.

Google translating search results is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Google subdomain & 302 spam is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

What amazed me again was which URL's Google picked, on some sites they seem "obvious", on this one it picked a few posts, and I can't say I really understood why. None of the posts it picked were particularly well linked, both internally and externally. It would be nice to be able to influence those site links a bit more...

More Sitelinks! is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Well, yes, these pages do have duplicate title tags. But they have something else as well:

[code language="html"]

[/code]

Perhaps, Google, instead of working on these nice webmaster tools, you should start honoring simple stuff like a meta name="robots" first.

Google Webmaster Tools Content Analysis shows Google breaks the rules. is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

If you know that a site has decreased in visible PageRank, are you going to buy a link there and expose your linkbuying efforts? Or are you going to look for sites who have not had their PageRank lowered to buy your links from? Exactly.

That is why you want to keep track of PageRank for sites you might at some point in time consider buying links on...

PageRank: more valuable than ever is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

It's not enabled for me yet, but once it becomes available, I think I'll switch to that instead of my regular IMAP.

That’s it! I’m switching to GMail! is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

So let me get this straight, they couldn't reach the page, because it gave a normal HTTP 200 Success code? Seems like a bug to me...

Google doesn’t get it? is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

This creates some very odd looking results, see this search for "makelaar" instance, there's 5 pages in that top 10 that are of no use to anyone, beginning with the #1... Or check the SERP for "hypotheek" (mortgage in Dutch) the second site there basically is an affiliate site showing the big banks what they should be doing (writing good content about the subject), but it's probably ranking also because of the enormous keyword density for the word hypotheek... (Just search for hypotheek in your Firefox and check "highlight all", if the page is all yellow, you know what's happening.)

So basically, Google, do something about it, you're looking stupid now...

BTW, Google quality guys, check this out, I hope you know what to do with people promoting their sites like that :)

Google: keyword density should NOT be this important is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

• Results from the last 24 hours
• Results from the last week

Searching for freshly indexed pages is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Searching with Google: country based results made easy is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

This is a rough version, so I'd love to hear your comments on how to improve this cheat sheet!

Google Search URL parameters cheat sheet is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

1. http://googlewebmastercentral.blogspot.com/2007/02/come-see-us-at-ses-london-and-hear.html
2. http://googlewebmastercentral.blogspot.com/atom.xml
3. http://googlewebmastercentral.blogspot.com/rss.xml
4. http://googlewebmastercentral.blogspot.com/feeds/posts/default

Now as you can see, 3 out of the 4 results here, are feeds... All these three feeds show the exact same content. That is one giant duplicate content problem right there... And I'm not even starting about the horrible user experience this is for me... Come on guys, start plumbing the blog!

“Plumbing the web” – duplicate content issues at Google Webmaster Central is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Another reason why Google is slow in spidering your site might be that your server is slow... Google actually indicates this to you, and I shortly addressed this in my post on how to use Google Webmaster Tools. If this is the case, Google shows you this in the "Crawl rate" overview of the Diagnostic tab:

My advice: set it to "Faster", but don't stop with that: make your server react faster, either by upgrading your hosting, your hardware, or whatever is needed. Chances are that when Google is suffering long load times, your users are as well.

Now if both of these aren't right for you, Google has found many great links to your site and it's not telling you it would like to crawl faster, there is one solution to make sure it crawls your new articles or pages even faster: sitemaps.

I don't use them on this site myself, as I want to know how Google crawls my site without me interfering in the process. However, if you think you have something to gain by Google crawling your new pages faster, an XML sitemap is a plausible solution.

Do consider though that you're throwing data away, you'll never know if and when Google would have found a page by itself if you hadn't put it in the sitemap.

How to get Google to crawl your site faster is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

Wikipedia describes an API as: 'An application programming interface (API) is the interface that a computer system, library or application provides in order to allow requests for services to be made of it by other computer programs, and/or to allow data to be exchanged between them.'

Now these API's are super useful, I use them in several of my scripts and have great fun with them. I used the Technorati API, for instance, in the first version of the Technorati rank and link count Greasemonkey script I wrote. This was fast, and worked quite well for a while, so I was very happy. After a few hours of browsing though, it stopped working. The error I got was 'You have used up your daily allotment of Technorati API queries.'

Now I can't understand why they'd want to limit use of the API like that. Why not? Well, now that I have decided to not use the API (after all how much is 500 queries when you distribute this script to 100+ people?), I'm left with no other choice but to scrape the content of their normal site. This costs them way and way more bandwidth, and it's significantly slower. That's not much of a service is it? Remember: I do want to use their services! I want to know the Technorati rank for each page I'm visiting, that's a good sign for them, isn't it?

So, please Technorati: get rid of that maximum number of queries. Oh and Google and Yahoo!, if you're listening? Do the same, please!

Web 2.0 and APIs: the case for Unlimited queries is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

As readers who read this blog often well know, one of my best sites is www.css3.info. It's a site about the newest kid of the CSS family, and it attracts quite a lot of tech-savvy readers. As you can imagine, quite a large portion of my readers uses Firefox. However, in the last few days, this percentage has gone up... I started researching why, and that's what caused this article.

If you type in "CSS3" in your search box, you will get quite a lot of suggestions. The funny things is that on the SERPs for most of the suggestions you get, css3.info is in the top 10. And one the terms that you get suggested there, I have been getting more traffic. Now you tell me, is this a coincidence?

I thought so too... So: check Google suggest for your most important keywords, and make sure you rank for most, if not all, the suggestions it gives if that's possible. This especially applies to those having more tech-oriented sites, with a larger percentage of Firefox users.

Of course, if you do find that for more than 25% of the terms Google suggests, you're not ranking, and they are related to your sites topic, you should really reconsider your keyword research methods...

[tags]firefox, seo, google, google suggest, firefox 2, search engine optimization[/tags]

Why you should check Google suggest is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!

This makes a lot more sense. Recently the tattoo blog of my colleague Roy suddenly got a whole lot more visitors from Google then he had done in the 3 months before, resulting from suddenly heavily increased rankings.

Now we couldn't figure out why he had been Sandboxed, since he only got in the Sandbox after 9 months or so. However, if I turn it around, it makes more sense. He had gathered some bad incoming links, and recently gained some very good incoming links, among which some DMOZ ones. I think that was the final push he needed to get enough Trust to rank well.

However if this is the case, that would mean you really can do damage to other sites by adding bad links to their sites, as i discussed earlier in my article about which links hurt and which don't.

The Sandbox, or is it the Trustbox is a post from Joost de Valk's Yoast - Tweaking Websites.A good WordPress blog needs good hosting, you don't want your blog to be slow, or, even worse, down, do you? Check out my thoughts on WordPress hosting!