ブログパーツとしてYahoo!ニュースのRSSを埋め込む方法

たまにではありますがクライアントから他のブログ等を埋め込みたいと依頼されることがあります。
方法はいくつかあるのですが、今回はphpやWordPressの小難しいカスタムではなく「Yahoo! Japan の爆速YQL」というサービスを利用する方法を紹介致します。

無料で使えて、サーバーサイドのプログラムも不要。
がっつりカスタムをしないのであれば簡単に設置が可能です。

こちらのサイトに詳細は記載されています。
記事自体は古いですが、今でも使えます。
XMLのWebAPIを爆速で使いこなせるフレームワーク

記述方法はこんな感じです。

<script src="http://i.yimg.jp/images/yjdn/js/bakusoku-yql-v1-min.js"
  data-url="表示したいRSSのURL"
  data-yqltable="feed"
>
<ul>
{{#query.results.item}}
<li><a href="{{link}}">{{title}}</a></li>
{{/query.results.item}}
</ul>
</script>

この表記だけでブログパーツとしてRSSを読み込むことが可能です。

自分の場合は少しカスタムをしてこんな風に使ったりします。

<script src="http://i.yimg.jp/images/yjdn/js/bakusoku-yql-v1-min.js"

  data-yql="SELECT * FROM feed

             WHERE url='http://headlines.yahoo.co.jp/rss/all-c_sci.xml'

             LIMIT 10">

<div class="rss_wrap">

<h2 class="rss_title">最新NEWS</h2>

<ul class="rss">

{{#query.results.item}}

<li><a href="{{link}}">{{title}}</a></li>

{{/query.results.item}}

</ul>

</div>

</script>

クラスをつけてCSSで見た目をカスタム出来るように。
合わせてLIMITの部分に「10」と指定して10件まで表示するように設定しています。

ややこしい設定をする必要がないので、お手軽に設置したい場合には有効な方法かと思います。