404ページを作成してみた。

404ページを作成してみたました。
テーマは、ワードプレスの人気テーマでもある、simplicity

なぜ、404ページを作成し、有益なものに変更するのか?

サイト訪問者が迷子になるような事態がおきてしまった場合、ユーザビリティ(利便性)を高めていることでサイトからの離脱を防ぐことができ、人気のある記事や投稿へのリンクを設置することでサイトの巡回率(pv数)をupすることができるからです。

可能であればコンタクトフォームを置き、何のページで、何のurlがリンク切れエラーなのか?を、教えてもらえるよう促し、より使いやすいサイトを作成できるようにしたほうが互いにとってプラスなはずです。

今回作った404エラーページの画像ですが、パッと見ただけでも印象は違うのではないでしょうか?

ウェブマスター ツール ヘルプにも、【有益な 404 ページを作成する】と、情報があります。

スポンサーリンク
adpc用

作成方法 | カスタマイズの前に

今回404ページをカスタマイズするにあたり、作成方法を参考にさせていただいたのが、【SEO効果を最大化するための404エラーページのカスタマイズ方法】です。

今回カスタマイズページを作るにあたり、phpは全くわからない初心者なので大変でした。

最悪の事態を想定して、元のファイルをコピーして保管。

コピーの、コピーに上書きして、アップロード。。。

やっぱり、うまく表示されません。。。

ソッコーで、元のファイルをアップロードしなおして考えました。。。

まぁ考えるも何も、今回参考にしたサイトはワードプレスのテーマが違うので、全く同じことをしてもうまくいくわけがありませんよね。少しぐらいphpがわかれば出来るのか知りませんが…(´・ω・`)

simplicityの404ページに関する記事を探しましたが、ピンとくるものもなく、【NOT FOUND】ページ見せ方について20141226にもあるように、テーマの作成者さんも404ページについては乗り気ではありません。

結局、外観→テーマの編集→404テンプレート(404.php)にhtmlの直書きプラス、

  • 検索フォーム
  • カテゴリー
  • コンタクトフォーム

を、設置するのみになりました。

本来であれば、サイトマップを読み込ませ、その下にコンタクトフォームとしたく、いろいろ検索しましたがサイトマップの読み込ませ方がわからなかったので断念。(´・ω・`)

目次へ

404ページの作り方

それでは、404ページの作り方を紹介します。

まずは下準備として、ワードプレスのプラグイン【Contact Form 7】を導入し、お問い合わせページ用・404ページ用のお問い合わせフォームのショートコードを作っておきましょう。

外観→テーマの編集→404テンプレート(404.php)に行きます。

404.phpを触っていなければ、このようになっているのではないでしょうか?

それを、このような形にし書き込んでいきます。

目次へ

検索フォーム

目次へ

カテゴリー

‘depth’ =は階層の意味です。

私は、3としていますが、これは3階層下まで表示されるということです。2であれば2階層。1なら1階層です。

カテゴリーの階層

目次へ

コンタクトフォーム

下準備で設定した404ページ用お問い合わせフォームのショートコードをいれます。

目次へ

カスタマイズし終わった404ページ

必要なアイテムを入れていき、後はhtmlとcssでコーディングして完成です。

完成したら、外観→テーマの編集→404テンプレート(404.php)のファイルに貼り付けます。

※ カテゴリー内・css内、少し修正しました。(2015/5/1)

目次へ

404エラーページまとめ

404ページの作り方が分かる人はいいですが、全くわからない人や、簡単に404ページを作りたい人は、カスタマイズし終わった404ページを丸々コピペして、リンク・コンタクトフォームID・【ホームページ奮闘記】など、変えるところだけ変えれば簡単にエラーページを作成できると思います。

私が使っているWordPressのテーマはsimplicityなので、他のテーマで使えるのかはわかりません。

404エラーページを作成する前にはしっかりとバックアップを取り、間違って消さないように注意してくださいね。

拙い文で、わかりづらい箇所などもあったと思いますが、サイトを作り始めたばかりなので、いいね・シェア等して頂けると嬉しいです。

目次へ

追記

※ (2015/5/17)

迷惑メール対策のために、Akismetなどのプラグインを入れ、通常のお問い合わせフォームでは、チェックボックスや画像認証機能を設置しています。

同じように404ページのお問い合わせフォームにも迷惑メール対策を施したのですが、何故か404ページからは迷惑メールが来るようになり、解決策が見いだせなかったので、現在は404ページを断念しています。

スポンサーリンク
adpc用
adpc用

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">