サポート
JSON フィードでブログのまとめページを作成する
JSON フィードとは?
JSON フィードとは、ブログの更新情報を Javascript 形式で実装された情報です。
JSON フィードは全てのブログで自動的に生成され、feed.js というファイルで公開されています。ブログが更新されるとそのブログの JSON フィードも自動的に更新されます。
例:http://***.lekumo.biz/weblog/feed.js
複数ブログのまとめページを作成する
Lekumo ビジネスブログ で複数のブログを作成している場合は、他の WEB ページに JSON フィードを組み込んで、複数ブログの最新記事一覧ページを作成することができます。
具体的には、Javascript 形式の JSON フィードを他のページの HTML で、以下のようなスクリプトを読み込み、処理を記述することで利用します。
サンプルスクリプト
<script type="text/javascript"> <!-- function TypePadJsonCallback(data) { var content = document.getElementById("matome"); var mydiv = document.createElement("div"); mydiv.setAttribute("class", "section updates"); var title = document.createElement("h3"); title.innerHTML = data.title; mydiv.appendChild(title); for (var i=0; i < Math.min(3, data.entry.length); i++) { entry = data.entry[i]; var myli = document.createElement("div"); var published = new Date(entry.published); if (isNaN(published)) { // for IE8 var month = entry.published.substr(5, 2); var day = entry.published.substr(8, 2); myli.innerHTML = "<h4><a href='" + entry.link + "'>" + month + " / " + day + " : " + entry.title + "</a></h4><p>" + entry.summary + " <a href='" + entry.link + "'>" + "詳しく読む" + "</a>" + "</p>"; } else { myli.innerHTML = "<h4><a href='" + entry.link + "'>" + ("0" + (published.getMonth() + 1)).slice(-2) + " / " + ("0" + published.getDate()).slice(-2) + " : " + entry.title + "</a></h4><p>" + entry.summary + " <a href='" + entry.link + "'>" + "詳しく読む" + "</a>" + "</p>"; } mydiv.appendChild(myli); } content.appendChild(mydiv); } --> </script> <div id="matome"></div> <script type="text/javascript" src="http://***.lekumo.biz/sample/feed.js" ></script> <script type="text/javascript" src="http://***.lekumo.biz/sample2/feed.js" ></script>
サンプルスクリプトを使用して複数ブログのまとめページを作成する
- サンプルスクリプトをコピー & ペーストする
JSON フィードを使用して更新履歴を表示したいページの HTML に、以下に用意されているサンプルスクリプトをコピー & ペーストします。 - サンプルスクリプト内の JSON フィード URL を変更する
サンプルスクリプトの以下の部分の URL を、表示させたいブログの JSON フィード URL (http://ブログ URL / feed.js)に変更します。
たとえば、5 つのブログの新規記事一覧を表示させたい場合は、以下の指定を 5 回表記し、それぞれの URL を各ブログの JSON フィード URL に変更することで可能です。 - 必要に応じて新規記事一覧の表示数を変更する
JSON フィードで表示する新規記事の表示件数をコントロールするには、以下の部分の 3 の数値を変更します。 - 編集した HTML を保存する
サンプルスクリプトの編集が完了したら、HTML ファイルを保存し、表示を確認します。
<script type="text/javascript" src="http://***.lekumo.biz/sample2/feed.js" ></script>
for (var i=0; i < Math.min(3, data.entry.length); i++) {