<span class="mt-enclosure mt-enclosure-image" /><img alt="Google AJAX Feed APIでブログの最新記事一覧ブログパーツ" src="http://web-marketing.zako.org/images/Google-AJAX-Feed-API-0.jpg" width="250" height="155" style="" /></span>

<p>3ステップで簡単にブログの最新記事一覧を作成できるツールがGoogle AJAX Feed APIから公開されていたので、早速試してみました。</p>

<!--more-->
<h4 class="tips">マウスオーバーで概要を表示</h4>
<p>完成形のひとつが↓、簡単に出来るわりに、なかなか使えそうじゃないですか？</p>
<!-- ++Begin Dynamic Feed Wizard Generated Code++ -->
<!--
// Created with a Google AJAX Search and Feed Wizard
// http://code.google.com/apis/ajaxsearch/wizards.html
-->

<!--
// The Following div element will end up holding the actual feed control.
// You can place this anywhere on your page.
-->

<div id="feed-control"> <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span> </div>

<!-- Google Ajax Api
-->
<script src="http://www.google.com/jsapi?key=notsupplied-wizard"
type="text/javascript"></script>

<!-- Dynamic Feed Control and Stylesheet -->
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
type="text/javascript"></script>
<style type="text/css">
@import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
</style>

<script type="text/javascript">
function LoadDynamicFeedControl() {
var feeds = [
{title: 'WEBマーケティングブログ',
url: 'http://feeds.feedburner.jp/webmarketing'
}];
var options = {
stacked : false,
horizontal : false,
title : ""
}

new GFdynamicFeedControl(feeds, 'feed-control', options);
}
// Load the feeds API and set the onload callback.
google.load('feeds', '1');
google.setOnLoadCallback(LoadDynamicFeedControl);
</script>
<!-- ++End Dynamic Feed Control Wizard Generated Code++ -->

<h4 class="tips">最新記事の概要をロール表示</h4>
<p>↓もうひとつのタイプがこれ、デフォルトの記述は1ページに1個しか表示できないため画像で失礼。</p>
<p><img src="http://inlinethumb21.webshots.com/21780/2230854430101983878S500x500Q85.jpg" alt="Google AJAX Feed API で作った最新記事一覧"></p>

<h4 class="tips">最新記事一覧作成ガイド</h4>
<ol>
<li><a class="google" href="http://www.google.com/uds/solutions/wizards/dynamicfeed.html" target="_blank">Dynamic Feed Control Wizard</a>のページを開きます。</li>
<li>↓「1.Customize it」の部分でスタイルとフィードのキーワードを指定。</li>
<p><img src="http://inlinethumb01.webshots.com/20480/2022808480101983878S425x425Q85.jpg" alt="フィードコントロールのカスタマイズ"></p>
<p>私が試したところ、ブログ名を入れたら自分のブログのRSSフィードURLが勝手にセットされました。他のブログもいくつか試しましたが、大抵は表示されるようです。</p>
<li>「プレビュー」を押してコードを発行</li>
<li>&lt;body&gt;&lt;/body&gt;の間に発行されたコードをコピペして完了。</li>
<p>あとは「Loading...」の部分を<a class="tool-link" href="http://www.ajaxload.info/" target="_blank">Ajax loading gif generator</a>などで作ったローディングイメージに変えたりして見栄えを調整。</p>
</ol>

<p>簡単にこういったものが作れてしまうのは、私のような技術力のない人にはとても感動を覚えますｗｗ。というわけで、iGoogle用のガジェットも作ってみました。↓</p>
<script src="http://gmodules.com/ig/ifr?url=http://sigeos15.googlepages.com/web-marketing-dynamicfeed.xml&amp;up_category=%E6%96%B0%E7%9D%80%E8%A8%98%E4%BA%8B%E4%B8%80%E8%A6%A7&amp;up_query=WEB%E3%83%9E%E3%83%BC%E3%82%B1%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0%E3%83%96%E3%83%AD%E3%82%B0&amp;up_numresults=10&amp;up_saved=&amp;up_feeds_json=&amp;synd=open&amp;w=320&amp;h=200&amp;title=WEB%E3%83%9E%E3%83%BC%E3%82%B1%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0%E3%83%96%E3%83%AD%E3%82%B0+Feed+Gadget&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>
<p>どうやらここでは表示できないようですが、iGoogleでは表示確認済みです。</p>
<h4 class="tips">WEBマーケティングブログFeed Gadgetの表示サンプル</h4>
<p><img src="http://inlinethumb37.webshots.com/22564/2346517710101983878S425x425Q85.jpg" alt="goog178.gif"></p>
<p>↑これがiGoogleで表示してみたサンプル。もしよかったら使ってみてください。作り方の概要はWEB担当者が仕事でiGoogleを効率よく使うための15のガジェット、15番の「自分専用のガジェットを作っちゃおう」が参考になりそうです。</p>

<p>より幅広い層の人が気軽に開発出来るような環境を作ることによって、自らのコンテンツを倍増させるGoogleの戦略、究極の差別化を図ることが出来ていますね。すばらしいと言うか恐ろしいというか、どちらにせよ成功へと向かっていることは間違いないようです。</p>

<ul>
<h4 class="tips">関連情報</h4>
<li>Via:<a class="google" href="http://googleajaxsearchapi.blogspot.com/2007/10/ajax-feed-api-addition-dynamic-feed.html" target="_blank">Google AJAX Search API Blog</a></li>
<li>iGoogle ガジェットカテゴリー</li>
<p>Google Ajax APIを試すシリーズは、過去に<a href="http://web-marketing.zako.org/google/google-ajax-search-api-image-search.html" onclick="javascript:urchinTracker('/go/Under_link');">Google AJAX Search APIのイメージ検索</a>や、<a href="http://web-marketing.zako.org/web-tools/google-ajax-feed-api-slide-show-044.html" onclick="javascript:urchinTracker('/go/Under_link');">綺麗な無料デスクトップ壁紙をゲットできるスライドショー</a>、<a href="http://web-marketing.zako.org/web-service/google-map-fricker-mash-up.html" onclick="javascript:urchinTracker('/go/Under_link');">Google MapとFlicker画像検索のマッシュアップ</a>、などにもチャレンジしています。</p>
</ul>