【自作テーマ開発】WordPressオリジナルテーマの作成方法③(404ページの作り方)

WordPress

この記事の監修者

三谷 将大

1997年 愛知出身。
業界5年以上。実務経験後に独立し、30社以上のホームページ制作やマーケティング支援を行っている。

404ページとは?

404ページとは、存在しないページにアクセスしたときに表示されるエラーページのことです。

間違ったURLでアクセスされると表示されます。
他にも削除されたページや非公開のページにアクセスした場合も、404ページが表示されます。



404ページのデザインがない場合のデメリット

オリジナルテーマで作成した場合に404ページを作らないとデフォルトでは以下のように表示されます。

しかし、これではトップページに戻ることも出来ず、ユーザーにとって不親切であると言えます
また、サイトのデザインや雰囲気にも合わず、不信感をいだかせてしまいますね。

このようなデフォルトの404ページではなく、できればデザインされた404ページにしたいですよね。
その場合は以下の手順で自作する必要があります

オリジナルテーマでの404ページの作り方

404ページの作り方ですが、それほど難しくありません、。テンプレートファイルを作るだけです。
固定ページを作って設定する必要はありません。

テンプレートファイルの名前は『404.php』です。

デザインによってコードは変わりますが、ヘッダーとフッターを読み込むこと。トップページへ戻るボタンを設置することを推奨します。

<?php get_header(); ?>
<main>
  <h1>404 NOT FOUND</h1>
  <p>お探しのページはありませんでした。</p>
  <div><a href="<?php echo esc_url( home_url( '/' ) ); ?>">Topページにもどる</a></div>
</main>
<?php get_footer(); ?>

404ページを制作する際、コンテンツ量が少なく、フッターが最下部に来ないことがあります。
その場合はコンテンツにmin-height: 100vh; を設定すれば解決できます。

タイトルとURLをコピーしました