「すぐ使えるCMS」で新着情報として書き出した「短い一覧」を、<iframe>（インラインフレーム、アイフレーム） でホームページに組み込む方法を紹介します。
基本的な設定方法の他、<iframe> を使った時に起こりがちな問題（スクロールバーの表示、直接アクセスされる、古いものがキャッシュされる、等々）の調整方法もご紹介します。
ホームページへの新着情報の表示方法
ホームページへ「すぐ使えるCMS」から書き出した新着情報を表示するには、下記の手順で設定して下さい。
I. 短い一覧（新着情報）のURLを調べる
「すぐ使えるCMS」の管理画面から、「チェック」→「短い一覧」を表示させて、新着情報が書き出されているページのURLを調べて下さい。
II. ホームページへの<iframe>の追加
新着情報を表示させたいホームページ（Webサイトのトップページなど）に以下のコードを追加して下さい。
青字の src 属性の部分は I で調べた「短い一覧」のURLを指すように変更して下さい。src 属性以外も自由に調整して下さい。CSSは style属性の内容を変更しても、style 属性の代りに class属性で指定してもOKです。
<iframe>タグの例
<iframe
style="border: 0; width: 270px; height: 300px; margin:0; padding: 0;"
scrolling="no"
frameborder="0"
src="webdir/index_short.html"
>(IFRAME 機能を有効にして下さい)</iframe>これでホームページに新着情報（短い一覧）が表示されます。引き続き「すぐ使えるCMS」側の設定を行って下さい。
「すぐ使えるCMS」側の設定
<iframe> でホームページに新着情報を表示する場合、「すぐ使えるCMS」側にいくつか調整が必要になる点があります。必要に応じて、下記の2点を調整して下さい。
1. リンクのウィンドウ調整
表示された新着情報（短い一覧）内のリンクをクリックした時、どのウィンドウにリンク先のページを開くかを変更する事ができます。変更するには、templates/article/short_list.txt を編集して下さい。
リンクのウィンドウ調整の概要
テンプレート内に含まれているリンクに、target 属性を設定します。下記例からご希望の設定を選んで編集して下さい。
【ご注意下さい】使用する製品によって編集前テンプレートが微妙に異なりますので、赤字の部分のみ変更を加えて下さい。
インラインフレーム内にリンク先を開く場合
インラインフレーム（<iframe>）内にリンク先のページを開く場合は、target属性は不要です。初期設定で target属性が付いていたら削除して下さい。
<!-- 製品の文字コードと同じ で保存して下さい -->
%_yyyy_%-%_mm_%-%_dd_%
<a href="index.html#%_d_%" target="_top">%_subject_%</a>同じウィンドウに開く場合の編集例
同じウィンドウ、つまり <ifame> の親ページを開いているウィンドウにリンク先のページを開く場合は、target属性に「_top」を指定して下さい。
<!-- 製品の文字コードと同じ で保存して下さい -->
%_yyyy_%-%_mm_%-%_dd_%
<a href="index.html#%_d_%" target="_top">%_subject_%</a>新しいウィンドウに開く場合の編集例
新しいウィンドウ（別ウィンドウ）にリンク先のページを開く場合は、target属性に「_blank」を指定して下さい。
<!-- 製品の文字コードと同じ で保存して下さい -->
%_yyyy_%-%_mm_%-%_dd_%
<a href="index.html#%_d_%" target="_blank">%_subject_%</a>2. メタタグの調整（頻繁に更新する場合）
※製品によっては初期設定でこの設定がされています。
インラインフレームで組み込まれた内容はページ表示時にキャッシュされて古いものが表示されてしまう場合があります。頻繁に新着情報を更新する場合は templates/article/short_list.html を編集してキャッシュを制限するためのメタタグを追加して下さい。赤字が追加部分です。
【ご注意下さい】使用する製品によって編集前テンプレートが微妙に異なりますので、赤字の部分のみ変更を加えて下さい。
templates/article/short_list.html 編集後
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<title>記事一覧</title>
</head>
<body bgcolor="#ffffff">
<!-- article list : generate from short_list.txt -->
%_article_list_%
</body>
</html>
アップロード
以上2点の変更をしたら、変更したファイルをサーバの同じ位置に上書きアップロードして下さい。
- templates/article/short_list.txt
- templates/article/short_list.html
再構築
管理画面の一覧の下にある「再構築（テンプレート変更反映）」ボタンを押して下さい。最新のテンプレートを反映したファイルが書き出されます。
確認
ブラウザのキャッシュを一旦クリアして表示と動作の確認を行って下さい。
<iframe> の利用でよく起きる問題への対応
インラインフレームの利用でよく起きる以下の問題への対応については、それぞれリンク先のページをご覧下さい。
スクロールバーの調整
短い一覧が長くなってしまった場合もインラインフレームのスクロールバーを出さないようにする方法は下記ページをご参照下さい。
<iframe> ページへの直接アクセスを回避する
検索エンジンなどから <iframe> 内のページに直接アクセスされてしまった場合にメインのページにジャンプする方法は下記ページをご参照下さい。