Blogger 聯播程式產生器 - 增加「最新文章與最新回應」與「標籤訂閱」程式產生器

Jinyao 的 blog 中提供了Blogger聯播程式產生器，所產生的程式碼可以顯示出一個 blog 的最新文章，可以用來訂閱其他 blog 的最新文章，也可以用來作自己的 blog 的最新文章表列，相當不錯唷！

目前還沒有增加聯播的部份，先更新一下最新文章的程式碼。Blogger聯播程式產生器所產生的程式碼如下：

<div id="newpostslittle_hat">
<h2>Loading...</h2>
</div>

<script>
function handlePostslittle_hat(json) {

var temp = '<h2>小帽依然碎碎念</h2><ul id="Feed001_feedItemListDisplay">';
var postshow=10;
for (var i=0, post; post = json.feed.entry[i]; i++) {
if(i>=postshow) break;
var title=post.title.$t;
var link=post.link[0].href;
var authorname=post.author[0].name.$t;
var timestamp=post.published.$t.substr(0,10);
temp += '<li><span class="item-title"><a href="'+link+'">'+ title +'</a>-'+timestamp+'-'+authorname+'</span></li>';
}
temp+="</ul>";
document.getElementById("newpostslittle_hat").innerHTML = temp;
}
</script>

<script src="http://little-hat.blogspot.com/feeds/posts/default?
alt=json-in-script&callback=handlePostslittle_hat" type="text/javascript"></script>


因為用作自己 blog 內的最新文章時不需要註明這是哪一個 blog 的文章，以及發佈者是誰，所以將上面的紅色部份刪掉，變成下面這樣：

<div id="newpostslittle_hat">
<h2>Loading...</h2>
</div>

<script>
function handlePostslittle_hat(json) {

var temp = '<ul id="Feed001_feedItemListDisplay">';
var postshow=10;
for (var i=0, post; post = json.feed.entry[i]; i++) {
if(i>=postshow) break;
var title=post.title.$t;
var link=post.link[0].href;
var authorname=post.author[0].name.$t;
var timestamp=post.published.$t.substr(0,10);
temp += '<li><span class="item-title"><a href="'+link+'">'+ title +'</a></span></li>';
}
temp+="</ul>";
document.getElementById("newpostslittle_hat").innerHTML = temp;
}
</script>

<script src="http://little-hat.blogspot.com/feeds/posts/default?
alt=json-in-script&callback=handlePostslittle_hat" type="text/javascript"></script>


然後在 sidebar 增加一個 html/javascript 的框架，將程式貼上就大公告成了！程式碼更精簡，速度比原來的快唷！感謝 Jinyao 的分享！

如果你願意聯播小弟的 blog，可直接複製下列的程式碼帖到您的blog，會顯示最後更新的兩篇文章。

<div id="newpostslittle_hat">
<h2>Loading...</h2>
</div>

<script>
function handlePostslittle_hat(json) {

var temp = '<h2>小帽依然碎碎念</h2><ul id="Feed001_feedItemListDisplay">';
var postshow=2;
for (var i=0, post; post = json.feed.entry[i]; i++) {
if(i>=postshow) break;
var title=post.title.$t;
var link=post.link[0].href;
var authorname=post.author[0].name.$t;
var timestamp=post.published.$t.substr(0,10);
temp += '<li><span class="item-title"><a href="'+link+'">'+ title +'</a>-'+timestamp+'-'+authorname+'</span></li>';
}
temp+="</ul>";
document.getElementById("newpostslittle_hat").innerHTML = temp;
}
</script>

<script src="http://little-hat.blogspot.com/feeds/posts/default?
alt=json-in-script&callback=handlePostslittle_hat" type="text/javascript"></script>



<更新>

昨晚與今天早上測試過之後，跟原作者堯反應跟建議一些事項，沒想到下午程式產生器就出來！真是高啊！詳情請看：「最新文章與最新回應」與「標籤訂閱」程式產生器。

原本的聯播程式產生出來，在用作最新文章的時候，會導致原本的最新回應無法正常顯示(原本的最新回應程式碼也是堯所提供的！)，所以堯要提供了一段顯示最新回應的 script，這樣一來就能正常顯示，速度也能便快唷！

另外一個就是標籤訂閱部份，我跟堯說，像我會碎碎念，可能人家不是全部都很愛看，想說只要聯播關於單車或是攝影的部份，應該會比較符合特定 blog 導向。所以這一個部份也可以獨立產生出程式碼來訂閱，真是太棒啦！