Pocket

ページが増えてくると、サイト内で共通している部分の変更があったときの書き換えが大変ですよね。
サイトを、CMSのように共通している部分を別々に管理出来たら便利だと思いませんか?

例えば、グローバルナビゲーションを共通ファイルとして読み込むと、
その共通ファイルを変更すれば、すべてのページに変更を反映させることができたりします。

そこで、PHPを使ってグローバルナビゲーションを共通ファイルにする方法をご紹介したいと思います。

 

navi001

 

今回のご説明に使わせていただく、基本的なサンプルコード。

上記のグローバルナビゲーション部分を共通ファイル化してみたいと思います。

 

STEP1 グローバルナビゲーションをひとつのファイルに書き出す

サンプルコードのグローバルナビゲーションの箇所を、 global_menu.php として、ひとつのファイルで書き出します。

global_menu.phpを以下の場所に設置します。

例えば、ルート階層がhtdocsフォルダの場合の設置例は以下になります。
img_navi002

 

STEP2 PHPインクルード関数を使って、共通ファイルを読み込む

PHPのinclude関数を使って、先程作成をしたglobal_menu.phpを外部ファイルとして読み込みます。
以下のコードを、サンプルコード内に書かれた <div id=”menu”>~</div> の箇所へ埋め込みます。

サンプルコードの書き換えを行った例が以下になります。

設置イメージとしては、青色の箇所に共通化したグローバルナビゲーションを読み込むような感じです。

img_navi004

 

補足として include関数で使っている $_SERVER['DOCUMENT_ROOT'] について少しご説明をさせていただきますが、
この変数はPHPではじめから定義されている変数で、ドキュメントルート(URLでいうとドメイン直下)のパスを返してくれますので、以下のようなフォルダ構成であっても、$_SERVER['DOCUMENT_ROOT']を使うことによって、相対・絶対パス(/や../など)を意識することなく自動的にドキュメントルートから global_menu.php を読み込みが行われます。

img_navi003

また、include関数を使う際、以下のようにCSSや画像ファイルと同じように相対・絶対パスを記述することもできますが、この方法では階層ごとに記述を変えなければならず不便です。
$_SERVER['DOCUMENT_ROOT'] を使ってパスを自動取得することをオススメします。

 

グローバルナビゲーションを例に、1つのファイルを共通ファイルとして管理する方法をご紹介させていただきましたが、
その他にも、ヘッダーやフッター、サイドバーなどにも応用できますよね!

 

スタッフ募集のお知らせ

株式会社それからデザインでは現在、エンジニア・プログラマー、デザイナー、ディレクターを募集しています。自社サービスやクライアント企業のブランディングに関わるモノづくりの現場であなたの経験を活かしてみませんか?
ご興味のある方は、下記より募集要項をご覧ください。

生きるように働く人の仕事探しサイト「日本仕事百貨」に、当社のSE・プログラマー募集の記事が掲載されました。是非ご覧ください。