「共通してる部分を全ページいちいちベタ書きコーディングするの!!?」
ホームページを制作していると、こういう悩みに必ずぶち当たります。メインのナビゲーションだったりフッターだったり、全部のページで同じ部分をベタ書きのhtmlにしておくのか…修正が入った場合、1ページ1ページ修正しないといかんのか!?
サイト全体のページ数が少なかったり、共通部分がページによって微妙に違う部分をもたせたかったりすると状況は違うかもしれませんが、後々の修正・更新を考えると、共通部分を別ファイルにしてリンクする方法の方がよかですよね。
わたくしは、共通部分をphpで読み込むことにしています。
〈共通部分の作成〉共通phpの作成
たとえば、お店のホームページで、トップページ以外に、「お店の紹介」「交通アクセス」「メニュー紹介」3ページがあるとします。どのページにもメインナビゲーションがあり、この3ページへのリンクを貼りたいです。
まず元になるメインナビゲーションの部分(共通にしたい部分)を下のようにつくります。
この共通部分であるメインナビゲーションだけ記述したファイルをphpファイルとして保存します。仮にファイル名をmainnavi.phpとしましょう。このとき、拡張子を.phpにするのをお忘れなく。
class指定だったり使うコードは任意でなんでもいいです、お好きなように。
しかし、画像やリンクのパスは「相対パス」ではなく「絶対パス」にしておくと、共通部分を設置するページの階層がバラバラになっても、リンク先がエラーにならずに安心です。たとえば「トップページ」と「お店の紹介」ページは階層が違ってて、ナビゲーションは1つのファイルにしたいので、それぞれのページに読み込んだときに、違う階層からリンクするので「相対パス」だと設置するページによってリンク先が変わっちゃうわけです。
共通部分を設置したいページへの呼び出し
共通部分を設置したいページに、上記で作成したphpファイルへのリンクを貼ります。設置したい箇所に以下のコードを記述します。
<?php include(“(共通ファイルまでのパス)/mainnavi.php“); ?>
設置したページもphpファイルにしないと動かないので、設置したページの拡張子もphpに変更します。
この作業を設置する全ページにおこないます。
設置する全部のページに作業が発生するのでメンドイかもしれませんが、最初にこれをやっておけば、共通部分に修正が発生した場合でも、phpファイル1つを修正するだけで全部のページに反映され、将来的に楽できるので設定しておいたほうがいいでしょう。
「いやいや、拡張子htmlのままがいいんですけど..」という方には、phpを読み込む方法でも、htmlのままいける手があるので、こちらをどうぞ。