My studying notebook

2009/01/02

Feed media:thumbnail Item

1/02/2009 10:22:00 PM Posted by Kai-Chu Chung , No comments

In my early two posts(I,II). I talk about Blogger in Draft new features, the Geotagging. There are many blogger discuss the new feature in comments of New feature: Geotagging by Blogger In Draft. Now, maybe you don't understand that this post i will talk about feed item and why i will remind it.

If you had read the post of blogger draft new feature. You will notice that the author offer a Gagdet(here). It's add a google map in you blogger that parser feed georss:point data of your post feed. And i found Blogger Developers Network announced a feature about media:thumbnail(here). It's talk about you can get a 72x72 pixel image in your feed if you add first image in your post. Those give me a idea. I modify my blog template that just list the post if you click the older post link in the footer of blog.
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<!-- Show article title only -->
<div class='thumbnail_'>
<table>
<tr>
<td>
<script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;callback=GetThumbnail&quot;'
type='text/javascript'>
</script>
</td>
<td>
<h3 class='post-title' id='list-title'>
<a expr:href='data:post.url'>
<data:post.title/>
</a>
<h2 class='date-header'>
<data:post.dateHeader/>
</h2>
</h3>
</td>
</tr>
</table>
</div>
<b:else/>
<b:include data='post' name='post' />
</b:if>


function GetThumbnail(json) {
var url = (typeof(json.entry.media$thumbnail) != 'undefined') ? json.entry.media$thumbnail.url : &quot; & quot;
if (url.length & gt; 0) document.write('&lt;img src=\&quot;' + url + '\&quot;/&gt;');
else document.write('&lt;img src=&quot;http://lh3.ggpht.com/_R8RzIm7ykRo/SV4RzpSayLI/AAAAAAAAHwI/MH3vuAtAzMA/nopic.gif&quot; /&gt;');
}

The above code. javascript code pass one feed by pass data:post.id and execute callback functionGetThumbnail to write the image url.

get your blogger thumbnail←←


0 comments:

Post a Comment