CodeIgniter 4でレイアウトを共通化！View Layoutの使い方完全ガイド

CodeIgniterでレイアウトテンプレートを作成する方法

先生と生徒の会話形式で理解しよう

生徒

「CodeIgniterでWebサイトを作っているのですが、全ページに同じヘッダーやフッターを書くのが面倒です。もっと楽な方法はありませんか？」

先生

「それは『レイアウト（Layout）』という機能を使うのが一番ですよ。共通の部分を1つのファイルにまとめて、中身だけを入れ替える仕組みです。」

生徒

「それなら、デザインを変えたい時も1箇所の修正で済むから便利そうですね！どうやって設定すればいいのでしょうか？」

先生

「設定はとても簡単です。今回は、CodeIgniter 4のビュー活用術であるレイアウトとパーシャルの作り方を、基礎から丁寧に解説していきますね！」

1. レイアウトテンプレートとは？初心者向けの考え方

Webサイトを作るとき、一番上のメニュー（ヘッダー）や一番下のコピーライト（フッター）は、どのページを開いても同じであることが多いですよね。これをページごとに毎回コピーして貼り付けていると、もし「メニューの色を変えたい」と思った時に、100ページあれば100回修正しなくてはなりません。これは非常に大変な作業ですし、ミスの原因にもなります。

そこで登場するのが「レイアウトテンプレート」です。これは、いわばWebサイトの「外枠」や「入れ物」のようなものです。パズルの枠だけを先に用意しておいて、中身のピース（各ページ独自のコンテンツ）だけをカチッとはめ込むようなイメージで、効率的にWebサイトを組み立てることができます。CodeIgniter（コードイグナイター）というPHPのフレームワークには、この仕組みが標準で備わっています。

2. 土台となる「共通レイアウトファイル」を作ろう

まずは、サイト全体の共通部分となるファイルを作成しましょう。これを「親ファイル」と呼ぶこともあります。このファイルには、HTMLの基本的な構造（headタグやbodyタグなど）を書き込み、中身が入れ替わる部分に特別な目印を付けておきます。

CodeIgniterでは、renderSection()という命令を使って、「ここに中身が入りますよ！」という場所を指定します。保存場所は app/Views/layout_main.php としましょう。


<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>My Awesome Website</title>
</head>
<body>
    <header>
        <h1>僕のホームページ</h1>
        <nav>共通のメニューがここに入ります</nav>
    </header>

    <main>
        <!-- ここに各ページの内容が流し込まれます -->
        <?= $this->renderSection('content') ?>
    </main>

    <footer>
        <p>© 2026 プログラミング教室</p>
    </footer>
</body>
</html>

上記のコードにある renderSection('content') が非常に重要です。content という名前を付けたエリアを確保したことになります。これにより、後で作成する各ページがこの場所をめがけて情報を送ってくれるようになります。

3. 各ページの中身（コンテンツ）を作成する方法

土台ができたら、次は実際に表示したい「中身」を作ります。例えば「プロフィールページ」を作るとしましょう。このファイルは app/Views/profile.php として保存します。ここでは、先ほど作ったレイアウトファイルを使うことを宣言し、どこに何を表示するかを記述します。


<!-- どのレイアウトを使うか指定します -->
<?= $this->extend('layout_main') ?>

<!-- 'content' という名前のセクションを開始します -->
<?= $this->section('content') ?>
    <h2>自己紹介ページ</h2>
    <p>こんにちは！私はプログラミングを勉強中の初心者です。</p>
    <p>CodeIgniterを使って、効率的な開発を目指しています。</p>
<?= $this->endSection() ?>

ここで使っている extend() は「このレイアウトを引き継ぎます」という意味です。そして section('content') と endSection() で囲んだ部分が、先ほどの親ファイルの renderSection('content') の場所にスッポリとはまります。まるでお弁当箱の仕切りに、おかずを詰めていくような感覚ですね。

4. コントローラーでビューを呼び出す手順

ファイルが準備できたら、最後にブラウザで表示させるための命令を出す「コントローラー」を記述します。コントローラーは、Webサイトの司令塔のような役割を持っています。ユーザーからのリクエストを受け取り、「このファイルを表示して！」と指示を出します。

app/Controllers/Home.php などのファイルに、以下のように記述してみましょう。プログラミングが初めての人でも、この一行を書くだけで魔法のようにページが表示されます。


namespace App\Controllers;

class Home extends BaseController
{
    public function profile()
    {
        // profile.phpを表示するように指示します。
        // レイアウトの結合はCodeIgniterが自動で行ってくれます。
        return view('profile');
    }
}

コントローラー側では、中身のファイル（profile）を呼び出すだけでOKです。CodeIgniterが自動的に「あ、このファイルは layout_main を使いたいんだな」と判断して、合体させた状態で画面に出力してくれます。これをレンダリングと呼びます。

5. パーシャル（部品化）でさらに管理を楽にしよう

レイアウトを使いこなせるようになると、次に「サイドバーだけ複数のページで使い回したい」「広告エリアを独立させたい」といった要望が出てきます。そんな時に便利なのが「パーシャル（Partial）」という考え方です。パーシャルとは「部分的な」という意味で、小さな部品としてファイルを分ける手法です。

例えば、サイトのサイドバーを app/Views/parts/sidebar.php として作っておき、それをレイアウトの中で呼び出すことができます。こうすることで、レイアウトファイル自体がスッキリして、読みやすくなります。料理で例えるなら、メイン料理とは別に、作り置きの小鉢を添えるようなものです。


<!-- app/Views/parts/sidebar.php -->
<div class="sidebar" style="border: 1px solid #ccc; padding: 10px;">
    <h3>カテゴリー</h3>
    <ul>
        <li>プログラミング</li>
        <li>料理</li>
        <li>旅行</li>
    </ul>
</div>

この部品を呼び出すには、レイアウトファイルの中で include や view() 関数を使います。部品として独立させておくことで、一部のページにだけサイドバーを出したい時や、特定の場所にだけバナーを表示したい時に、とても柔軟に対応できるようになります。

6. 実践！動的なデータをレイアウトに渡す方法

最後に応用編として、ページごとにタイトルの文字を変える方法を紹介します。これまでの方法だと、タイトルが常に「My Awesome Website」になってしまいますが、SEO（検索エンジン最適化）の観点からは、ページごとに適切なタイトルを付けることが推奨されます。

コントローラーからデータを送り、レイアウト側でそれを受け取る仕組みを使えば、ページごとに自由なタイトルを表示できます。これを「変数の受け渡し」と言います。


// コントローラーでの記述
public function profile()
{
    $data = [
        'page_title' => 'プロフィール | 私のサイト',
        'user_name'  => '太郎'
    ];
    return view('profile', $data);
}

このように、連想配列（名前と値のセット）を作って view() の第2引数に渡すと、ビューファイルの中で $page_title という変数として使えるようになります。これを <title> タグの中に埋め込めば、ページごとに異なるタイトルが表示されるようになり、Googleなどの検索エンジンにも正しく情報が伝わるようになります。

7. 初心者がつまずきやすいポイントと解決策

プログラミングを始めたばかりの頃は、少しの書き間違いで画面が真っ白になったり、エラーが出たりすることがあります。特にレイアウト機能を使う際に多いのが、「セクション名の打ち間違い」です。親ファイルの renderSection('content') と、子ファイルの section('content') の名前が1文字でも違うと、中身が表示されません。

また、ファイルの保存場所にも注意しましょう。CodeIgniterは app/Views フォルダの中を自動的に探しに行きます。もしサブフォルダ（例えば layouts/main.php）に入れた場合は、extend('layouts/main') のように、フォルダ名も含めて指定する必要があります。こうした細かい決まりごとを守ることで、エラーなくスムーズに開発を進めることができます。パソコンの操作に慣れていない方は、まずはファイルを正確に保存する練習から始めてみてくださいね。

8. レイアウト機能を活用するメリットのまとめ

ここまでの内容を振り返ると、レイアウトテンプレートを使うメリットは大きく3つあります。1つ目は「コードの重複を避けられる」こと。2つ目は「メンテナンスが劇的に楽になる」こと。そして3つ目は「サイト全体のデザインに統一感が出る」ことです。大規模なWebサイトになればなるほど、この仕組みの恩恵は大きくなります。

最初は難しく感じるかもしれませんが、一度覚えてしまえばこれなしでは開発できないほど便利な機能です。CodeIgniterには、他にも便利な機能がたくさんありますが、まずはこのビューのレイアウト管理をマスターすることが、脱・初心者への第一歩となります。自分の作りたいWebサイトの構造を紙に書いてみて、「ここは共通」「ここはページごとに違う」と整理してみるのも良い練習になりますよ。一歩ずつ、楽しみながら学んでいきましょう！

公的機関での指導実績【CodeIgniterモダン開発実践セミナー】

商用CodeIgniter 4 徹底実践講座：軽量MVCによる高速開発とシステムのモダナイゼーション

#商用設計 #APIアーキテクチャ #市場価値最大化

ハローワーク職業訓練講師の実績を持つプロが監修。商用PHP開発の「現場の作法」を完全伝授。

「極限のパフォーマンス」を実装する。CodeIgniter 4で軽量・高速な商用システムを構築。

本講座では、フレームワークのオーバーヘッドを最小限に抑えた「高レスポンスなWebアプリケーション設計」を学びます。シンプルながら強力なCodeIgniter 4を通じ、既存システムのPHP 8.x対応や、リソース効率を極めたAPI開発など、実務で重宝される最適化技術を習得します。