ネットと副業

副業が本業の収入を大きく超えたので会社やめました

日記

《ホームページ制作》共通部分をphpで読み込む

投稿日:

f:id:nekonkeo:20150506131237j:plain

「共通してる部分を全ページいちいちベタ書きコーディングするの!!?」

ホームページを制作していると、こういう悩みに必ずぶち当たります。メインのナビゲーションだったりフッターだったり、全部のページで同じ部分をベタ書きのhtmlにしておくのか…修正が入った場合、1ページ1ページ修正しないといかんのか!?

サイト全体のページ数が少なかったり、共通部分がページによって微妙に違う部分をもたせたかったりすると状況は違うかもしれませんが、後々の修正・更新を考えると、共通部分を別ファイルにしてリンクする方法の方がよかですよね。

 

わたくしは、共通部分をphpで読み込むことにしています。

〈共通部分の作成〉共通phpの作成

たとえば、お店のホームページで、トップページ以外に、「お店の紹介」「交通アクセス」「メニュー紹介」3ページがあるとします。どのページにもメインナビゲーションがあり、この3ページへのリンクを貼りたいです。

まず元になるメインナビゲーションの部分(共通にしたい部分)を下のようにつくります。

gista80da0cfaaa449817f7d

この共通部分であるメインナビゲーションだけ記述したファイルをphpファイルとして保存します。仮にファイル名をmainnavi.phpとしましょう。このとき、拡張子を.phpにするのをお忘れなく。

class指定だったり使うコードは任意でなんでもいいです、お好きなように。
しかし、画像やリンクのパスは「相対パス」ではなく「絶対パス」にしておくと、共通部分を設置するページの階層がバラバラになっても、リンク先がエラーにならずに安心です。たとえば「トップページ」と「お店の紹介」ページは階層が違ってて、ナビゲーションは1つのファイルにしたいので、それぞれのページに読み込んだときに、違う階層からリンクするので「相対パス」だと設置するページによってリンク先が変わっちゃうわけです。

共通部分を設置したいページへの呼び出し

共通部分を設置したいページに、上記で作成したphpファイルへのリンクを貼ります。設置したい箇所に以下のコードを記述します。

<?php include(“(共通ファイルまでのパス)/mainnavi.php“); ?>

設置したページもphpファイルにしないと動かないので、設置したページの拡張子もphpに変更します。

この作業を設置する全ページにおこないます。

設置する全部のページに作業が発生するのでメンドイかもしれませんが、最初にこれをやっておけば、共通部分に修正が発生した場合でも、phpファイル1つを修正するだけで全部のページに反映され、将来的に楽できるので設定しておいたほうがいいでしょう。

「いやいや、拡張子htmlのままがいいんですけど..」という方には、phpを読み込む方法でも、htmlのままいける手があるので、こちらをどうぞ。

www.aveit.biz

-日記

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

マーケティングの基礎は「伝える」ということ

マーケティングというと、セグメンテーションやらターゲティングやら、こむずかしい言葉が先行しがちなイメージです。 今の社会を分析したり、客観的に人を観察したり。 あたかも自分と別社会に対して物やサービス …

no image

《iPhone買い替え》その3 〜事前準備 データをiTunesにバックアップをする〜

iPhone機種変更します。 iCloudへのバックアップはこちら nekonkeo.hatenablog.com iCloudにバックアップが完了してりゃぁ、まぁそれでいいっちゃいいんすけど、iCl …

no image

インコの匂い入浴剤の風呂、入ってみました。

最初聞いたときは、全くもって受け入れることはできないし、いまだに理解不能な点も多々ありますが、「インコの匂いのする入浴剤」というものがこの世には存在します。 パッケージこれです。 「インコイメージ入浴 …

恐怖…LacieのHDDが認識しない…ケース入れかえたら…

Laceiの外付けHDDを使っております。 これです。2TBのやつ。 2001年宇宙の旅のモノリスみたいな見た目で気に入っております。 超大事なデータが入っておるのですが、数日ぶりに使おうとおもたら認 …

no image

〈つづき〉Instagramの自分フィードをブログやホームページに設置する方法〈はてぶの場合〉

Instagramの自分のフィードをブログとかホームページにのっけたくないですか? Instagramの自分のフイードを取得するには、「SnapWidget」を使うと便利です。SnapWidgetから …