Post.snippet and post.thumbnail: tools for summarizing your blog

The snippet and thumbnail attributes now appear to be available for all Blogger posts, even though they're not documented in Blogger's official list.  This article shows documents what I've found out about them.

"Fields" in Blogger:

Many people are used to computer systems that are based on databases which have rows (records) and columns (fields).

Blogger does use a database.

But instead of record.field notation, Blogger templates use XML tags to access the data  that make up blog posts.

This means that Blogger templates can be made up of statements like this:

<b:if cond='data:post.title'>
      <h3 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h3>
    </b:if>

This basically says "If the post has a title, and if it has a link, then show the title value linked to the URL.   If it just has a title but no link, then just show the title.   Otherwise don't show anything in this spot.   And if something is shown, format it with the header-3 style."

A list of the tags (much like fields or attributes in other programming languages) that Google has told us about is available in this help article (I have a link to it in the "handy tools" section of the sidebar).

But recently people have noticed two new tags that are not included in this list, and have started writing Blogger tweaks, hacks etc to make use of them.   They are are

• data:post.snippet
• data:post.thumbnail

I haven't been able to find any official documentation about what these tags refer to.

But I have done some investigations in a test blog    (by altering the template to explicity show these things, and then making posts with particular possible values.    And this is what I've found.



Post.Snippet

If a post has a jump-break before character 140, then the snippet is all the text before the jump-break.

But if the post does not have a jump-break, or it is after character 140, then the snippet is the first 140 or so characters.   (Line breaks are shown when the snippet is displayed, in Blogger, but they are not included in the character count).

Currently, the only way to control what is in the snippet is to put the contents at the start of the post.  There is no other way to edit it.    (You may notice that all the posts in Blogger-Hints-and-Tips start with a paragraph or two in bold.   This is how I flag the "snippet" code to myself.)


Post.thumbnail

I haven't been able to work out the rules for this item by testing options.   So far I know that:

• Not every post has one, sometimes it's blank even if there's an image in the post
• It's not automatically the first image in the post
• It's not automatically the last image in the post.
• It's not the automatically the biggest image in the post.

I now strongly suspect that it's the first image in a post that is both hosted in Picasa-web-albums and  over a certain size.


What readers see:

Unless you edit your blog template to use these values in a visible way, then your readers will not see anything different.

But there are some specific ways that you might to use them, including:

• Setting the post-description meta-tag to the value of post.snippet
• Editing the template to only show the snippet or thumbnail on certain types of pages.

And if you allow your visitors to see your blog using Dynamic templates, then I'm 99.9% sure that the post.snippet is the picture used to represent your blog in some of the more graphical formats.


Using these tags

If you are happy to accept the disadvantages of edit your blog's template, then you can show the snippet and thumbnail anywhere inside the blog post area.

The code to use to display them is:

<data:post.snippet/> - for the snippet, and

<img expr:src='data:post.thumbnailUrl'/>  - for the thumbnail

You need to put the thumbnail into an image tag because, of course, it is an image.



Do you have any more information?

In this article, I've documented what I have found out about these two fields by doing some testing.   But it's likely that I've missed some things out.

Have you been able to find, or work out, any more detailed rules about what post.thumbnail shows?

What else have you found out about these tags - or any other tags that are available in our blog-templates but not in the official list?

---

Related Articles:



Installing code into your blog

Centering gadgets in your blog.

What are dynamic templates

Advantages and disadvantages of editing your blog's template

Putting text and pictures side-by-side