SSIをマスターしよう
ネットショップでは、商品数が増えてくると、比例してページ数も増えます。ページ数が増えると、管理の手間も増えます。商品説明の変更や価格の変更、ページデザインの変更、カラーの変更、やまもりてんこ盛りです。
ネットショップを全部制作ソフトなんかで作ってしまうと、運営中は編集作業の度に、ソフトを立ち上げては編集、FTPでサーバーにアップしてはチェック。こんな面倒な作業が待ち構えています。商品数1000点以上ともなれば、サイト管理のために1人雇わないといけないハメになるかも知れません。
そこで、そういった管理の手間を一気に省いてくれる技術の1つ、SSIを紹介したいと思います。特別変わったテクニックでも何でもなくて、昔からあるサーバー上の機能です。以下、データベースCGI活用講座（商品ページをCGIを使って自動作成するための方法を解説）の一部です
※楽天退店組、法人の通販参入や切り替え向けシステム まじめに生き残りを考えている企業向けの通販システム（※個人事業主、副業は不向き）
|
|
|
まずはやってみよう！
前回のSSIで便利を実感された方も多いと思います。でも、前回ピンと来なかったかたは以下の実験をするとピン！と来るでしょう。用意するのは2つのHTMLファイルです。
(1) a.html
(2) test.shtml （拡張子にご注意“.shtml”です。）
そして、それぞれのファイルの中に以下の内容を書きます。
(1) a.html
<h1>すげぇ！</h1>
これだけです。
<HTML>も<BODY>もなしです。（これがミソ）
「<h1>すげぇ！</h1>」これだけ書いて「a.html」で保存です。
次に、
(2) test.shtml
<html>
<body>
<!--#include file="a.html" -->
</body>
</html>
この2つのファイルをセットでサーバの同じフォルダない（ディレクトリ）にアップロードします。そして、test.shtmlにアクセスします。
いかがですか？
「test.shtml」にアクセスしているにもかからず「すげぇ！」と表示されていますよね。
「すげぇ！」と書いたのは「a.html」です。
不思議ですよね？
それでは、「test.shtml」のソース（HTML部）を見てください。（右クリック→ソースの表示）
「test.shtml」のページの中に「a.html」のHTMLが読み込まれて表示されているのが分かりますか？まるで、「test.shtml」が「a.html」をパックリ食べた感じです。これを、「SSIのファイル読み込み機能」と言います。読み込めるのは、「.html」以外「.txt」ファイルもOKです。
仕組みは簡単
さて、SSIのコメントの書き方です。「CGIの実行結果などを読み込ませる」場合は
<!--#include virtual="～～～" -->
としますが、（“virtual”と書くのがポイントでした。）今回のように、「同一フォルダ内」の単なる静的ファイルを読み込ませる場合は、
<!--#include file="～～.html" -->
とします。（“file”と書くのがポイントです。）
同じファイルを読み込ませる場合でも、「相対パス」や「絶対パス」になる場合は場合は、
<!--#include virtual="../../a.html" -->
と“virtual”を使うのがポイントです。
当サイトでも使ってます。当サイトの左部分を見てください。メイン・メニュー（グローバルナビゲーション）がありますよね。
・HOME
・ネットショップの開業方法
・ネットショップの仕入れ
・ネットショップの運営
・
・
当サイトのページ数は、今20ページ以上はあると思います。「各ページ」の左側には、このメイン・メニューを配置しています。ほとんどのページのこの場所にメイン・メニューが配置されています。
一見、何でもないことなんですが、ある日、メイン・メニューに「特定商取引法」を追加しようとします。あるいは「お問合せ」でもいいでしょう。
どうでしょ。
ページは50ページ以上です。昔ながらのサイト作り方をしていると、50ページのメニューの部分全部に変更を加えないといけませんよね。
HP編集ソフトを使っても、コピペでシコシコ作業をしないといけません。1000ページ以上もあれば、その作業だけで1日が終わってしまいます。そこで、当サイトでは各ページSSIを使っています。
メインメニューは「menu.html」として1つのファイルを別に用意しています。（外部ファイルと言います。）そして各ページのメニューを配置する場所に、SSIのコメント
<!--#include file="menu.html" -->
この一行を入れています。
結果、メイン・メニューに追加、変更があった場合、「外部ファイル」の「menu.html」だけを変更してやれば、20ページ上のメニューの箇所は一瞬にして変更できるわけです。
どうですか？
理屈分かりますでしょうか？？「どのページでも同じ部分」にSSIを使えば、何ページになろうが編集作業は一発です。いや一瞬です。
以上、好評を博したメルマガからの抜粋でしたがいかがでしょうか。
SSIでファイルの大きさを測定したり、日付を表示させる方法は、多く書かれていることがあるんですが、こういった使い方を解説しているページはあまり見かけません。
今回紹介したものは、単にファイルの中身を読み込む機能だったんですが、SSIはCGIの実行結果も読み込むことができます（これは号泣の機能ですよ）。
また、Java Scriptを使って、同じように外部ファイル読み込む方法があります。これも非常に便利です。Java Scriptのファイル読み込み機能は、当サイトのサンプルショップで使っています。ソースをじっくり見ると何かおかしなことに気づくと思います（笑）
|
|
|
