404.phpの作り方

404.phpは、WordPressにおいてURLが存在しなかった場合に表示されるテンプレートファイルです。

その役割や作り方について解説します。

404.phpとは

404.phpは、404エラーコードを返すためのテンプレートファイルです。

そのWordPressをインストールしているドメイン配下の存在しないURLにアクセスしたときに、自動的に呼び出されて表示されます。その際、404.phpが存在しない場合はindex.phpが代わりに表示されてしまいますので、基本的には用意しておく必要があるファイルです。

404.phpを用意するメリット

存在しないページへ訪れたユーザーへ適切な導線を用意できることが、大きなメリットです。

またSEO対策の面では、404エラーを返すことでURLが存在しないことをクローラーに示せます。そのため余計なクロールを減らし、不明なURLがインデックスされるのを防ぐ役割としても重要なファイルです。

404.phpの作り方

404.phpは、テーマフォルダ直下に設置します。

/wp-content/themes/テーマフォルダ/404.php

名称は404.phpで固定ですので、変えないようにしてください。

404.phpのサンプルコード

当テーマDAWNYでは、404.phpを下記のコードで実装しています。

<?php
if(!defined('ABSPATH')) exit;
// header読み込み
include TEMPLATEPATH . '/header.php';
?>

<article class="error-page">
    <section>
        <div class="error-page-container">
            <h1>404<span>NOT FOUND</span></h1>
            <div class="error-page-text">お探しのページは移動または削除された可能性があります。</div>
            <div class="error-page-search">
                <?php get_search_form(); ?>
            </div>
            <div class="simple-btn">
                <a href="<?php echo home_url(); ?>">トップページに戻る</a>
            </div>
        </div>
    </section>
</article>

<?php
get_footer();

一般的に下記の要素で構成されます。

  • ヘッダー
  • 「404」を含むタイトルやh1タグ
  • ページが存在しないことを示すテキストや画像
  • 検索フォーム
  • トップページへの導線
  • フッター

凝っているWebサイトほどオリジナリティの高い404ページを用意している傾向にあります。こだわってみてはいかがでしょうか。