Meta Description - More Detailed Explanation

Check out the code generator and video
tutorial for this hack in my new article:
Custom Meta and Title Tags for Blogger

Since more details are needed about how to add meta descriptions and keywords for each blogger page, I've written a new article on this topic. This is a continuation of the Meta Description for Each Blogger Page article and it's not meant to replace it. Please make sure you read the initial post carefully and follow all the instructions in it to avoid messing up your Blogger template.

blog structure

I won't discuss all the elements in a blog, but the ones we're interested in are the main page and the post pages. Unless you're publishing your blog on a custom domain, the link to the main page looks similar to this one:

http://_something.blogspot.com/

Post pages contain the individual articles/posts in your blog and they have permanent links (Blogger calles them "permalinks") which look like this:

http://_something.blogspot.com/2004/03/name.html

Our aim is to add meta descriptions and keywords for these sort of pages, so we should keep in mind the types of links mentioned above. Remember that what you identify as a post/article or as the homepage is identified by a web browser using the respective link.

code explained

The code you need to use in order to add meta descriptions and keywords is this one:

<b:if cond='data:blog.url == "http://_something.blogspot.com/2004/03/name.html"'>   <meta content='DESCRIPTION' name='description'/>   <meta content='KEYWORDS' name='keywords'/> </b:if>

Let's look at each line and see what they mean:

• The first line expresses a condition: <b:if cond='data:blog.url == "http://_something.blogspot.com/2004/03/name.html"'> This basically says: "if the link (blog.url) that a user is viewing matches (==) a certain link (http://_something.blogspot.com/2004/03/name.html), do...".

• The second and third lines are the description and keywords themselves, placed in meta tags. An approximate translation for these two lines would be: "associate this description and these keywords with the current web page".

• The fourth and last line ( </b:if> ) ends the conditional statement.

If you connect this code explanation with the conclusion we've reached in the first section, you end up with a phrase that says:

If the page that a user is viewing is the main page or a certain post or article, associate these respective keywords and description to it.

That is exactly what we want to do and it is especially important since we can have a webcrawler (like the Googlebot) instead of a user. Unfortunately however, due to the fact that you can only declare a single "constant" link (http://_something.blogspot.com/2004/03/name.html) in this code batch, you have to repeat the sequence for your main page and for all your other post pages.

where to place it

Here's a screenshot that should explain where to place this code in your template:

You can place the keywords and description immediately above or below the <title>...</title> line - you choose. If your template looks different than mine, just look for the <title>...</title> line and make room for the code above or beneath it.

example

As a conclusion, we'll look at what you have to in a specific example. Let's say the link to your blog's main or home page is:

http://_something.blogspot.com/

We'll also consider that this blog only contains two articles published in February and March, 2008 and that their titles are "My First Post" and "Future Plans". The permanent links (permalinks) to these two post pages will be:

http://_something.blogspot.com/2008/02/my-first-post.html
http://_something.blogspot.com/2008/03/future-plans.html

The code you need to add to your template for the main/homepage and the other two post pages is:

<b:if cond='data:blog.url == "http://_something.blogspot.com/"'>
  <meta content='A blog about things I like' name='description'/>
  <meta content='my_name,blog,hobby' name='keywords'/>
</b:if>

<b:if cond='data:blog.url == "http://_something.blogspot.com/2008/02/my-first-post.html"'>
  <meta content='Why I've started this blog' name='description'/>
  <meta content='motivation,blog,first' name='keywords'/>
</b:if>

<b:if cond='data:blog.url == "http://_something.blogspot.com/2008/03/future-plans.html"'>
  <meta content='What my plans are' name='description'/>
  <meta content='future,plans,travel,vacation,Easter' name='keywords'/>
</b:if>

If you write a third article called "Easter Holiday" and post it in May, its permalink will be:

http://_something.blogspot.com/2008/05/easter-holiday.html

... and the updated code from your template will look like this:

<b:if cond='data:blog.url == "http://_something.blogspot.com/"'>
  <meta content='A blog about things I like' name='description'/>
  <meta content='my_name,blog,hobby' name='keywords'/>
</b:if>

<b:if cond='data:blog.url == "http://_something.blogspot.com/2008/02/my-first-post.html"'>
  <meta content='Why I've started this blog' name='description'/>
  <meta content='motivation,blog,first' name='keywords'/>
</b:if>

<b:if cond='data:blog.url == "http://_something.blogspot.com/2008/03/future-plans.html"'>
  <meta content='What my plans are' name='description'/>
  <meta content='future,plans,travel,vacation,Easter' name='keywords'/>
</b:if>

<b:if cond='data:blog.url == "http://_something.blogspot.com/2008/05/easter-holiday.html"'>
  <meta content='What I did this Easter' name='description'/>
  <meta content='travel,vacation,Easter,eggs,bunny' name='keywords'/>
</b:if>

If a user or webcrawler requests the http://_something.blogspot.com/2008/03/future-plans.html link (your second post page), the first, second and fourth conditions are not matched and the page they see will have only the meta description and keywords you specifically chose for it.

I hope this clarifies the steps you need to follow. Please post your comments and feedback about this explanation.

Related articles:

• Meta Description for Each Blogger Page
• Custom Meta and Title Tags for Blogger