SWELL│離脱を防ごう！404ページのカスタマイズ

SWELLの404ページはシンプルです。

ただ404ページから離脱が起きてしまう可能性があるので、カテゴリーを掲載するとか、絞り込み検索に変えるとかで工夫したいですよね。

実際のカスタマイズ後の表示

本記事では404のカスタマイズを紹介します。

著者

motoki

WEB制作をしているデジタルノマド
WordPressのカスタマイズが好きで、色々と自作しています。

WordPressのカスタマイズに困ったらご相談ください！

MOTOKI合同会社

カスタマイズの依頼・相談

SWELLの404ページのカスタマイズ方法

やり方は簡単です。

functions.phpのコードを挿入して、404のコンテンツを作るだけです。

実装方法について

まずSWELLの404ページ（wp-content/themes/swell/404.php）にはフックが使えません。

JavaScriptを使って、テンプレートを使わず非破壊のカスタマイズはSEO的には推奨しないので、普段は使わないのですが。404のページはnoindexです。

<meta name="robots" content="noindex, nofollow">

なので今回はJavaScriptを使って、テンプレートを使わずにカスタマイズすることにしました。

JavaScriptを拒否しているブラウザにはこのカスタマイズは適応されたません。

あとはもちろん404ページ以外のページには影響がないようにします。

if ( is_404() ) {
}

ブログパーツの作成

VK Filter Search Proや投稿リストブロックを使って、

検索、おすすめ記事、お問い合わせの内容を追加しました。

最後にブログパーツの記事IDもメモしておきましょう。

実際のコード

あとはfunctions.phpにコードを入れるだけです。

エラーが怖い人はCode Snippetsのプラグインを入れて、そこからコードを挿入しましょう。

ブログパーツのIDも忘れずに変更しましょう。