2005年01月16日

SSIでサイトの更新がちょっとだけ楽になるかも?

東京ホテルスタイルでは、SSI(Server Side Include)ってのを使ってます。
SSI...何やら難しそうな響きですが、使ってみるととてもカンタンで便利です。
東京ホテスルタイルを作る時に初めて使ってみたのですが、やっといてほんとよかったです。やってなかったら今頃泣いてます!

どんなふうに使っていて、どんなふうに便利かと言いますと...

こんなレイアウトのサイトがあったとします。
サンプル
東京ホテルスタイルも上記にあたりますね。
「ヘッダー」 にはサイトのタイトルなどが入ります。
「メニュー」 には、目次が入ります。
「フッダー」には、テキストリンクやコピーライトなどが入ります。

上記のレイアウトは、サイト全編で共通とします。
一度レイアウトを決めてしまえば、あとは、同じフォーマットでどんどんペ−ジを複製していくので、ページを増やすことはそんなに大変ではないと思います。

が、メニューに新しいコ−ナ−を作る場合、今まで作ったページのメニュー部分を全て直すのは大変です。

なので、後々楽なように、「メニュー」は別のファイルにしておいて、「メニュー」を更新すれば、全ページのメニュー部分も更新されるように、メニュー部分はSSIで表示させておくと、とても便利なのです。

そのように、別に用意してあるファイルを挿入したい時は、SSIの「includeコマンド」を使います。
includeコマンドの書き方は、
<!--#include コマンド引数="引数値" -->
となります。
例: <!--#include file="menu.html" -->

例えば、index.htmlというファイルのある部分menu.htmlを表示させたいと思ったら、
index.htmlに <!--#include file="menu.html" -->と記述すればよいのです。
で、忘れてはならないのは、 index.htmlをindex.shtmlというふうに、拡張子を「shtml」にしなければなりません。(SSIを使うためのサーバの設定が、通常はSSIは特別なファイル(拡張子が .shtmlやshtmのファイル)だけを対象にするように制限してあるからです。)

たったの1行の 記述で、グーンと更新が楽になりました!

サイトを作ったばかりの頃は、まだコンテンツも少なく、これからどんなコ−ナ−ができていくのか、自分でもわからなかったりします。ページを増やすたびに、メニューをコピペし直さなきゃならないなんて、大変です。

なので、最初に、メニューやヘッダー、フッダーなどの、共通して使う部品は別ファイルにしておくと便利です。
サイトが大きくなるほど、やっといてよかったー!と思いますよ。

SSIについての詳しい情報は、「Web for beginner ホームページ作成支援」さんの「SSI入門」がオススメです。

(※尚、SSIを許可していないサーバもありますので 、まずはお使いのサーバをご確認ください。)



この記事へのトラックバックURL

http://trackback.blogsys.jp/livedoor/tlt/12432751
この記事へのトラックバック
 試験的にメインサイトのTOPページにSSIを使用して様子を見ていたのですが、何ら問題が無いようですので、サブメニューのページにもSSIを使ったページを適用しました。これでサイトのメンテナンス性が大幅にアップします。  過去にスタイルシートを使いはじめたと
SSIを本格的に適用し始めました【臨機応変?】at 2005年01月31日 23:06
 試験的にメインサイトのTOPページにSSIを使用して様子を見ていたのですが、何...
SSIを本格的に適用し始めました【臨機応変?】at 2005年10月09日 12:32
この記事へのコメント
stellaさん、わざわざ教えにきてくださって、
ありがとうございます〜〜。(感涙)。

紹介されている参考サイトなども見て
勉強してみたいと思います。

でも、まずメニューを別ファイルにして、
今のメニューのところを書き換えなくてはいけないのね・・・それは、それでサイト全体だと大変だにゃ〜〜〜(^^;)。

けれど、いまのうちになんとかしなくちゃ、
どんどん大変になるから・・・・・なんとかします。。
Posted by さますの at 2005年06月20日 19:08
さますのさん
ご参考になれば幸いですー。
Dreamweaverのライブラリを使うのとちょっと似ているのですが、Dreamweaverのライブラリの場合は「ローカルで展開」し、SSIは「サーバで展開」します。
なのでSSIの方が更新されたファイルをアップロードする手間がないので便利と思いますよ♪
Posted by stella at 2005年06月20日 23:10