ホームページとブログを連携する方法

☆*･カフェビバーチェ｡.:*･゜ﾟ･*☆*･゜ﾟ･*:.｡..｡.:*･☆

木曜日とご予約、イベント開催の場合は曜日にかかわらず、11:00～15:00、カフェをオープンしています。

コンセプトは、「おいしく健康に！」
食育トレーナーのオーナーが
コーヒー、お茶をはじめ、スイーツ、ランチなど
身体に優しいメニューをご用意してお待ちしています。

少人数グループのイベント会場としてもご活用くださいね。

☆*･゜ﾟ･*:.｡..｡.:*･☆･*:.｡. .｡.:*･゜ﾟ･*☆*･゜ﾟ･*:.｡..｡.:*･☆

おはようございます。
夢が叶うブログのHirokoです。

今日は、ホームページとブログの
連携方法についてです。

やり方は簡単。
ブログ記事を載せたいホームページ側のページに
Javascriptというプログラムを貼り付けます。

//Google Feed Api
google.load("feeds", "1");

function initialize() {

// ブログのRSSを設定　★★★はアメブロのIDです
var feed = new google.feeds.Feed("http://rssblog.ameba.jp/★★★/rss.html");

// 記事タイトルの表示文字数を20文字に設定
var maxTitleLength = 20;

// 記事タイトル取得件数を5件に設定
feed.setNumEntries(5);

feed.load(function(result) {
if (!result.error) {
var container = document.getElementById("feed1");
for (var i = 0; i < result.feed.entries.length; i++) {

// 記事タイトルを取得
var entry = result.feed.entries[i];
var title = entry.title;

// 記事タイトルを文字数調整
if (title.length > maxTitleLength) {
title = title.substr(0, maxTitleLength) + '...';
}

// 年月日設定
var dd = new Date(entry.publishedDate); // now
var yearNum = dd.getYear();
if (yearNum < 2000) yearNum += 1900;
var m = dd.getMonth() + 1;
if (m < 10) {m = "0" + m;}
var d = dd.getDate();
if (d < 10) {d = "0" + d;}
var date = yearNum + "." + m + "." + d + " ";

container.innerHTML += "<li><span>" + date +" </span><br/>" +"　<a href='" + entry.link + "' target='_blank'>" + title + "</a></li>";

}

}
});

}
google.setOnLoadCallback(initialize);

</script>

これで準備はOK。
そして、記事を表示させたいところで

<ul id="feed1"></ul>

と記述します。

こうしておくとブログの更新情報が自動的に
ホームページに反映されます。

今日も最後まで読んでいただいてありがとうございました。

Webであなたの夢が叶う！

Webを活用して一歩ずつ「夢」に近づきませんか？
みなさんのサポートブログです。

ホームページとブログを連携する方法