このブログのはてなブックマーク数 このエントリーをはてなブックマークに追加

知らなきゃ絶対損するPCマル秘ワザ

知らなきゃ損するPC情報を分かりやすくメモする個人ブログ。
『月,水,金』の週3回更新!(予定)

このブログ内をキーワードで検索することもできます。
Loading



最新記事
  • ニコニコ動画+Firefoxでプレイヤーが真っ黒になる症状 (03/22)
  • 中世ヨーロッパの文献の雰囲気をもつフリーフォント「eltic」 (03/20)
  • Windows:起動時のロック画面の背景画像を変えてみる (03/15)
  • Sublime Text 3:ミニマップの表示範囲を常に出しておく (03/13)
  • HTML5 プレイヤーでも「Turn off Nicomment」を使う (03/10)
  • 管理人より
    2100万アクセス突破!ありがとうございます。

    各ページのメニューを一括変更する

    このエントリーをはてなブックマークに追加
    サーバ管理って難しい(7)
    Menu


    こんにちは、さち です。

    今回は、ホームページを作成したなどに各ページで共通する部分である
    「ナビゲーションメニュー」「ヘッダー」「フッター」などを
    一括で管理する方法について書いてみようと思います。

    私の覚え書きとしての兼ね合いもある記事ですが
    同じことで困っている方に少しでも参考になれば嬉しいです。

    では、さっそく見ていきます!


    SSIを使う

    SSI は「Server Side Include」の略で
    HTMLファイルの中に"特殊なコメント"を記述することで
    サーバ側でその指示にしたがった処理をしその結果を出力します。

    特殊なコメントというのは実際にこのような感じです。
    例) <!--#include file="sample.html"-->

    上の例では記述では
    このコメントを書いた部分を「sample.html」の内容に置き換えるという指示です。

    これをナビゲーションメニューの部分などに使えば
    1つの HTMLファイル を書き換えるだけで
    すべてのページのナビゲーションメニューが書き換えられるので管理が非常に簡単になります。

    ただし、SSI を使うためには使用しているサーバが SSI に対応している必要があります。
    XAMPP でも SSI を使えるのでローカルで動作を確認することもできます。

       → Apache で SSI の設定Linuxで自宅サーバ様)


    拡張子は「shtml」

    SSI を利用した場合はそのファイルの拡張子を「shtml」にする必要があります。

    拡張子が「shtml」になっても
    特殊なコメントの部分以外は基本的にはHTMLの記述と全く変わりません。
    別途 PHP や JavaScript などのプログラミング言語を覚える必要がないので
    非常に簡単に使うことができます。

    「.htaccess」で別途設定をすれば
    拡張子が「html」のファイルに SSI を記述しても機能するようにできますが
    パフォーマンス や セキュリティ の面からあまり好ましくないようです。


    他にも便利なコマンドが

    私は今のところ「include」のコマンド以外は使う予定はありませんが
    他にも便利なコマンドが用意されています。

    こちらのページで分かりやすく紹介されていますので
    興味がある方は読んでみることをおすすめします。

       → とほほのSSI入門とほほのWWW入門様)


    UTF-8 で include を使う場合には注意!

    機種依存文字を考えるとUTF-8は非常に便利なのですが
    文字コードが UTF-8 で include を使用すると
    ページの上側に1行分の隙間ができてしまう症状が出ます。

    BOM(Byte Order Mark)というものが関係しているようなのですが
    私もこの問題にハマってしまい30分くらい格闘していました…。
    UTF-8 でページを作成しようと思っている人は気を付けて下さい。

    こちらのページに解決方法が紹介されています。

       → UTF-8でinclude使用時に上部に隙間ができる時の解決法ミトミトブログ様)


    この記事を作成するのに下記サイト様を参考にさせて頂きました、ありがとうございます。

       → とほほのSSI入門とほほのWWW入門様)
       → SSI入門初心者のためのホームページ作り様)
       → Apache で SSI の設定Linuxで自宅サーバ様)
       → UTF-8でinclude使用時に上部に隙間ができる時の解決法ミトミトブログ様)


    << 前へ | サーバ管理って難しい(7) | 次へ(次回未定) >>
    サーバ管理って難しいTOPへ










    このエントリーをはてなブックマークに追加




    管理人だけが読めるコメントにする(返信はしません)
    【お知らせ】
    • コメントは承認制です。反映に時間がかかります。
    • Yahoo!BBはスパムコメントが多いため一部規制中です。
    • URLを含む投稿はできません。必要な場合は最初のhを削って下さい。
    • 記事に直接関係ない個人のトラブルにはお答えできません。
    • Android は使ったことがないので質問を頂いても答えられません。
    • その他詳細はこちら





    記事別の週間アクセス数ランキングです。こちらの記事もぜひ読んでみて下さい。

    2008-2017 知らなきゃ絶対損するPCマル秘ワザ  無断転載禁止

    ブログパーツ