どうもこんにちは、最近友人とアンリミテッドバトルを行って勝ったので、戦利品として『B級裁判所コイン』を手にしたさいほうへいきです！ 現金価値にして、およそ1200円の価値があるんだとか。
前回の記事では、SSH通信を行う際に出現する謎のファイル『id_ed25519』について、Powershellでの使用方法を解説しましたね。
今回のテーマは、サイト内のページすべてに共通のヘッダー・フッターを導入する方法についてです。
複数のページに渡る大きなサイトを管理していると、それぞれのページにいちいちヘッダーのコードを入れるのはものすごく大変ですよね。
そこで必要になってくるのが、本来のページとは別の外部ファイルを読み込む方法です！
意外と複雑そうにも思えますが、たった一行のコードでこの機能は実現できます。
ぜひ最後まで読んで、あまり役に立たない教養をご獲得ください！
ヘッダー・フッターの管理問題
まずはこちらをご覧ください。僕が最近管理しているサイトのヘッダー部分です。
こんな感じのページがだいたい十ページほどあります。今後記事が拡充するにつれて、まだ少し増えそうですね。
このヘッダー部分は他のページともすべて共通なのですが、これまではすべてのページに同じコードをコピー、ペーストすることで行っていました。
しかし、サイトの運営を続けていたところ、とある問題が発生してしまいました……。
それが、ヘッダーの更新に尋常でない労力がかかるということです！
それもそのはず、ヘッダーはコピペとはいえそれぞれ別のファイルに書き込まれているので、アイコンひとつ変えるだけでも何十回も単調なコピペが必要になってしまうわけです。
これがとても大規模なサイトだったとしたら、それだけで数時間、あるいは数日を費やすことになるかもしれません。
そこで、まったく同じヘッダーなら、外部のひとつのファイルに抜き出してしまえば対処ができるのでは？ と考えました。
ウェブページを作るにあたって、同じ問題に遭遇した方も多いかもしれませんね。
解決方法は超簡単
というわけで、この問題を解決するために、外部のファイルをウェブページへ取り込んで表示することが必要になってきます！
が、この処理を実現するには、たったの一行を入れるだけで完成します。
<?php include __DIR__ . "/header.php"; ?>
「え？ ほんとにこれだけ？」と思われるかもしれません。
これだけです。
とはいえ少しだけ使い方にクセがあるので、使用の準備方法について下に説明していきます。
PHPに変更
まず、HTMLにしてはハテナが出てきたり、謎のピリオドがあったりと見慣れない書き方ですよね。
実はこれ、HTMLではなくてPHPという別のプログラミング言語で書かれたモノなんです。
ですが、新しいファイルを作ってうんたらかんたら……という手間はほぼかかりません。
ページファイルの拡張子をhtmlからphpに変えるだけなんです！
これだけでphpを使用する準備は整いました。
外部ファイルへの抜き出し
外部ファイルに保存したヘッダーを読み込んで使うためには、当然ですが一度外部に新しくファイルを作っておく必要があります。
ここでは、ウェブページのヘッダー部分（header～/header）だけを書き込んだファイルを作り、仮に『header.php』という名前で保存しておきましょう。
それから元のファイルのヘッダー部分を消すのを忘れないように！
これが残っているとヘッダーが二個に増えてしまいます。
実際の読み込み
では、元のウェブページファイルのヘッダー部分にさきほども挙げたこの一行を書き込み、開いてみてください。
<?php include __DIR__ . "/header.php"; ?>
……はい、きちんとヘッダーも表示されましたね！
というわけで、次の見出しではこれを他の方法に応用する方法について解説します。
応用
ヘッダーを表示するならここまででもなんとかなりますが、フッターを表示したり、はたまたそれ以外にも広告やサイドバーなどに応用するとなると理解して応用する力が必要になります。
とはいえ、PHPについて理解していないとできないというわけではありません。
ここではそのような基礎についての説明は省き、単に他のファイルを読み込むための方法について書いています。
理解するべきなのは次のふたつです。
__DIR__とは
まず、この見慣れない書き方についてご説明します。
これはPHPの用語でいうとマジカル定数と呼ばれるもので、実行環境によってさまざまなメタ的なデータを提供してくれるものです。
すべてアンダーバーふたつで始まり、アンダーバーふたつで終わるため見分けるのは簡単ですね。
その中で特に、今回の『__DIR__』というものは『そのファイルが存在するディレクトリの絶対パス』を指し示すマジカル定数です。
そのため、先ほどのコードの場合、マジカル定数を置き換えると次のような感じになります。
<?php include "https://www.example.com/header.php"; ?>
もちろん実際にホストするドメインなどでも変わりますが、おおまかにはこのような感じ。
PHPでは、文字と文字を接続し、ひとつの文字列にするためにピリオドを使うことに留意が必要です！ C#などではそのままプラス記号を使いますが、少し直感的に理解しづらいので難しいかもしれませんね。
筆者はここを打ちミスでコンマにしてしまい、500エラーを引き起こしてしまったことがあります。
ここでもし、このマジカル定数を使いたくないという時は、直接別の絶対パスを入力することも可能です。
たとえばかなり離れた場所にあるヘッダーファイルを読み込みたい場合には……
<?php include "https://www.example.org/hoge/fuga/piyo/header.php"; ?>
のように直接打ち込んでも動作してくれます。
ただし注意が必要なのは、こうして外部ファイルを読み込むと脆弱性の原因になりかねません。
そのため、インクルードはできる限り自分のサーバー内でのみ行うようにしましょう。
ファイル名について
header.phpを書き換えるだけです。
たとえばページ下部に共通のフッターファイル（footer.php）を入れたい場合には、
<?php include __DIR__ . "/footer.php"; ?>
これだけでオッケー。
ここまでで紹介したヘッダー・フッター以外にも、『このページを共有ボタン』、『全ページに表示したいニュースフィード』などでも使うことができます！
まとめ
というわけで、今回は『ウェブページでヘッダーなどを外部ファイルに保存し、読み込む方法』のご紹介でした！
ぜひこの内容を役立て、サイト運営に生かしてみてください！
また、僕の運営している小規模な掲示板『Heiki’s Board』については次の記事をご参照ください！
では、次の記事もぜひよろしくお願いします！
さいほうへいきでした。
コメント