404ページ
![](https://eguweb.jp/wp-content/uploads/202103032353-00-1024x603.jpg)
パーマリンクが見つからなかった時に表示される「404ページ」をカスタマイズしたい・・・と思った時に自作をする方法です。
cocoon子テーマで作成するには?
まずは、子テーマに「404.php」ファイルをアップロードします。
![](https://eguweb.jp/wp-content/uploads/202103032351-01.jpg)
404.phpのコード
<article class="post article">
<!--ループ開始-->
<h1 class="entry-title"><?php echo get_404_page_title(); ?></h1>
<?php if ( get_404_image_url() ): ?>
<img class="not-found" src="<?php echo get_404_image_url(); ?>" alt="404 Not Found" />
<?php else: ?>
<img class="not-found" src="<?php echo get_template_directory_uri() ?>/images/404.png" alt="404
Not Found" />
<?php endif ?>
<?php echo wpautop(get_404_page_message()); ?>
<?php //404ページウィジェット
if ( is_active_sidebar( '404-page' ) ): ?>
<?php dynamic_sidebar( '404-page' ); ?>
<?php endif; ?>
</article>
![](https://eguweb.jp/wp-content/uploads/202103040000-00-1024x462.jpg)
画像を変えるだけであれば「/images/404.png」の画像を差し替えてあげれば良さそうです。
条件分岐になっているのは、後で気付きましたが、404ページの設定がありました。今回の検索フォームを入れないのであれば、こちらの設定のみでもページの変更は可能です。
![](https://eguweb.jp/wp-content/uploads/202103042335-00-1024x587.jpg)
ひとまず、絶対URLで。
![](https://eguweb.jp/wp-content/uploads/202103040030-00.jpg)
変わりました!
![](https://eguweb.jp/wp-content/uploads/90bc0e374a1311dee704b4d71ac45c3a-1024x721.jpg)
ついでに、検索機能を追加してみる
このままだと、「お探しのページは見つかりませんでした」で終わってしまうので、404ページに検索機能を追加してみます。
<p>こちらから検索ください↓</p>
<?php get_search_form(); ?>
<a href="/"><p>TOPページへ戻る</p></a>
![](https://eguweb.jp/wp-content/uploads/202103040122-00-1024x721.jpg)
まとめ
このような感じで404ページのカスタマイズをすることができます!
ご参考下さい😃
※phpファイルを扱うと画面にエラーコードが表示されたりしますので取り扱いにはご注意下さい😃