サポート
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++) {