2013-9-06
ブログをホームページに表示させる方法
ブログで書いた記事を「新着情報」や「お知らせ」として利用している方も多いかと思います。
ただ、ブログを更新してもホームページ側には反映されないので、ホームページを見るだけでは閲覧者にリアルタイムで告知する事ができません。
そこで、登場するのが「Google AJAX Feed API」
RSSフィードを表示させる方法は沢山あるようですが、phpが苦手な私には救世主のような存在です。
しかも、Google AJAX Feed APIの方が安定しているとの噂です！！
簡単に何が出来るかというと…
・ブログのタイトルや記事を自ホームページに表示、反映させることが可能 ・日付も表示可能 ・表示したい件数を指定する事ができる ・表示したいカテゴリーを指定する事ができる ・アメーバーやFC2の無料ブログでも利用可能！もちろんWordPressもOK！！ ・いろんなサイトやブログでカスタム用のソースを用意してくれているので結構自由がきく ・何よりもフリーで利用できる
みたいな感じです。
私はjavascript（以下js）は分かりませんが、jsを理解している方なら超便利なはず！！ と、前置きはダラダラと長くなりましたが、以下のサイトが分かりやすかったので紹介したいと思います。
こちらから
ソースだけであれば、以下をサンプルを貼り付ければ、利用可能。 （間違いがあるかもしれませんので、ご容赦ください。間違いは随時修正していきます。） HEAD内に以下のソースを挿入。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<script src="https://www.google.com/jsapi" type="text/javascript"></script><script type="text/javascript">// <![CDATA[ google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("フィードのアドレス"); feed.setNumEntries(5) //記事の件数 feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("li"); var a = document.createElement("a"); //a要素を付け足す a.href = entry.link; a.target = "_blank"; //リンク先の指定 var date = new Date(entry.publishedDate); //日付の取得 a.appendChild(document.createTextNode(entry.title + " (" + date.toLocaleDateString() + ")" )); //日付の表示形式 div.appendChild(a); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); // ]]></script> |
BODY内に以下のソースを挿入。
|
1 |
既にホームページをお持ちの方で、今回の記事が気になった方は是非、チャレンジしてみてください。
コレだけでも、静的から動的ホームページに変化します(^_-)-☆