SSIスクリプトの設置方法

SSIスクリプトを用いた、SSIファイルの設置例です。

参考:SSIとは?
SSI = Server Side Include(サーバ サイド インクルード)の略で、主に、HTMLファイルの文中やプログラムを呼び出す際に使用されます。例えば、ファイルの最終更新時刻を自動的に表示させたり、共通のヘッダ(フッタ)を異なるHTMLファイルから呼び出したりもできます。

ポイント
SSIスクリプトを扱うファイル名(拡張子)は「.shtml」で保存する。
アップロードは「ASCIIモード(テキストモード)」で行う。

↓最終更新時刻を表示する
↓HTMLファイルを埋め込む


最終更新時刻を表示する (設置テスト その1)

01 最初に、以下のサンプルソースをそのままメモ帳やテキストエディタにコピーして、「update.shtml」というファイル名で保存します。
 
サンプルソース
 
SSIスクリプトやHTMLなどの記述については、書籍や参考サイトなどをご覧ください。
 

02 次に、SSIファイルをウェブサーバへアップロードします。
上述のポイントとおり、「ASCIIモード(テキストモード)」で行います。
 
例:Windows「FFFTP」を使う場合
例:Macintosh「Fetch 3.03J」を使う場合
 

03 最後に、SSIファイルをアップロードしたアドレス(URL)へアクセスして確認します。
 
アップロードした場所にもよりますが、ログインディレクトリ(docs/)に設置した場合は、「http://お客様ドメイン名/update.shtml」でアクセスできます。
 
また、下の「サンプルの結果表示」と同じように、表示されるか見てみましょう。
 
サンプルの結果表示
Last Update: 2003/03/10 11:55:07
 

  設置テストは以上です。
エラーが表示されうまく動かない場合は、再度、上述のポイントと、SSIファイルの書き方を再確認してみましょう。


HTMLファイルを埋め込む (設置テスト その2)

01 今度は、以下のサンプルソース3つ分(SSIファイル・HTMLファイル×2)を、メモ帳やテキストエディタにコピーして、それぞれの名前で保存します。
 
■SSIファイルのサンプルソース
ファイル名は、「body.shtml」で保存します。


SSIスクリプトやHTMLなどの記述については、書籍や参考サイトなどをご覧ください。

■HTMLファイルのサンプルソース(1つめ)
ファイル名は、「header.html」で保存します。


■HTMLファイルのサンプルソース(2つめ)
ファイル名は、「copyright.html」で保存します。


※SSIファイルとHTMLファイルとの位置関係に気をつけましょう。
 
<!--#include file="" -->は、呼出先のHTMLファイルが、同じディレクトリ内にある場合に呼び出せます。
 
<!--#include virtual="" -->は、呼出先のHTMLファイルが、違うディレクトリにあった場合でも、絶対パスや仮想パスで呼び出せます。
 

02 次に、SSIファイルとHTMLファイルをウェブサーバへアップロードします。
上述のポイントとおり、「ASCIIモード(テキストモード)」で行います。
 
また、アップロード先は、この設置テストに限り以下のようにしてください。
(本番用で設置される場合は、適宜、読み替えてください)
 
想定する設置テストの環境

例:Windows「FFFTP」を使う場合
例:Macintosh「Fetch 3.03J」を使う場合
 

03 最後に、SSIファイルをアップロードしたアドレス(URL)へアクセスして確認します。
 
アップロードした場所にもよりますが、上の環境とおりに設置した場合は、「http://お客様ドメイン名/body.shtml」でアクセスできます。
 
また、下の「サンプルの結果表示」と同じように、表示されるか見てみましょう。
 
サンプルの結果表示
Welcome!!
my HOMEPAGE

menu01 menu02 menu03

↑この上にHTMLファイル(header.html)を表示する。

ここは呼出元のSSIファイル

↓この下にHTMLファイル(copyright.html)を表示する。

Copyright(C) 1998,2003 *** Co.,Inc.
 

  設置テストは以上です。
エラーが表示されうまく動かない場合は、再度、上述のポイントと、SSIファイルの書き方を再確認してみましょう。