SSIを使ってCDPのメニューを管理する

up:

条件や注意点

  • そのサイトを運営しているサーバーがSSIを使える必要があります。
  • 拡張子を.htmlから.shtmlにする必要があります。
  • 現在のページを表す.menu-onは使えません。
  • .htaccess等を利用すれば、.html拡張子でもSSIを動かすようにもできます

やり方

  1. メニューリストを、テキストエディタに貼り付け、この際にclass="menu-onの記述は削除する。これをmenu.txt(便宜上なので管理しやすい名前で構いません)という名前で保存。(註:ページによって階層を分けている方は、href値(アドレス)をルートからの絶対パスを利用するなどしてどこのページから参照してもアクセスできるようにしてください)
    <ul>
      <li id="MENU01"><a href="index.html">index</a></li>
      <li id="MENU02"><a href="mail.html">作品</a></li>
      <li id="MENU03"><a href="diary.html">日記2</a></li>
      <li id="MENU04"><a href="link.html">リンク</a></li>
    </ul>
  2. メニューリストの記述消したhtmlファイルの、メニューリストがあった位置に、<!--#include file="menu.txtまでの相対パス" -->を挿入
    完成例
    <!--================-->
    <!--  メニュー  -->
    <!--================-->
    <div id="MENU">
    <h2>menu</h2>
    
    <!--#include file="menu.txt" -->
    
    </div>
    <hr>
  3. htmlファイルを上書き保存して、拡張子を.htmlから.shtmlに変更し、ファイルをアップロード

<!--#include file="~" -->でうまく読み込めない場合や上位ディレクトリのファイルを読み込みたい場合は、<!-- #include virtual ="~" -->を使ってルートディレクトリから指定する方法を利用してみてください。

詳しくは、検索サイトにてSSI #include等で検索してください。