AFFINGER5をカスタマイズ！404ページで離脱率を少しでも防ぐ方法【SEO対策】

相談者

AFFINGER 5で404ページをカスタマイズしてSEO対策をしたいんだけど、どうすればいいの？

こんな疑問にお答えします。

ワードプレスをはじめ、ブログやあらゆるサイトにおいてURLにアクセスをしたとき、404エラーが表示されることがあります。

はや

少しでもサイトにとどまってもらうように対策をしておくこともブロガーとしての努めです。

・・・と、偉そうなこと言ってますが、つい最近までわたしもほったらかしでした･･･。

AFFINGER 5では簡単に404ページをカスタマイズできる

結論ですが、ウィジェットだけで404ページをカスタマイズすることが可能です。

HAYAMIZ BLOGでは、「謝罪の言葉」「検索ウィンドウ」「トップページへ行くボタン」「新規記事一覧」を並べています。

画像のようにウィジェットの404ページで作成します。

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

step
1冒頭の謝罪文

ウィジェットの一番上に置きます。

カスタムHTMLを使って直接書き込みます。

はや

タグもそのままでよければ丸々コピペしてOKです。ただし、AFINGER専用ですのでご注意を。

pタグには空欄の部分がありますが、これは改行を表しています。

全角スペースを入力しないと効果を発揮しないのでご注意ください。

ここに画像を貼るは画像へのあなたが用意した画像への直リンクを書きます。

[/] shortcode
<p>
</p>
<p>
あなたがお探しいただいた記事はこちらの都合で<span class="rmarker-s">「削除」もしくは「アドレスを変更」</span>しております。
</p>
<p>
恐れ入りますが、下記の画像下にある<span class="rmarker-s">「検索」ウィンドウ</span>にて再度お探し頂けますでしょうか。
</p>
<p>
アドレス変更である場合は<span class="huto">記事が見つかる可能性</span>があります。
</p>
<p>
</p>
<p>
お手数おかけして申し訳ありません。
</p>
<p>
ここに画像を貼る
</p>
<p>
</p>
<p>
こちらからキーワードをご入力ください。
</p>

step
2検索ウィンドウを置く

謝罪文が完成したら、「検索」ウィジェットを2段目に置きます。

step
3トップページへ行くボタンの配置

一段目と同様にカスタムHTMLを使って直接書き込みます。

URLもあなたのトップページへ直してください。

[/] shortcode
<p>
</p>
<p>
</p>
<p>
下記のボタンから当ブログのトップページへ移動できます。
</p>
[st-mybutton class="" url="https://hayamizbg.net/" title="トップページへ行く" rel="nofollow" fontawesome="fa-home" target="" color="#000000" bgcolor="#FFF" bgcolor_top="" bordercolor="#CCC" borderwidth="1" borderradius="0" fontsize="" fontweight="" width="100" fontawesome_after="" shadow="" ref=""]
<p>
</p>
<p class="h3modoki">最新の投稿記事一覧</p>

step
4最新の投稿記事一覧を置いて完成！

4段目に「最新の投稿記事一覧」ウィジェットをおいて完成です！

AFFINGER5使っているなら、404ページを放っておくなんてもったいない（まとめ）

404ページは残念なページではありますが、現在のインターネットシステムでは必ず起きてしまうものです。

ひとりでも多くの読者を救うために、404ページをぜひカスタマイズして回遊率の引き上げ・読者へ貢献していきましょう！

はや

ぜひ、コピペしてご活用ください。

※AFFINGER5は稼ぐためだけに生まれたワードプレスのテーマです。

【最新版】ブログの開設方法をご紹介！ゼロから始める手順はコチラ【初心者向け】

関連記事を見る