現在デフォルトスキンとして「Season (Autumn)」を適用中。

独自の404ページ設定を行う方法

テーマ設定
この記事は約2分で読めます。

Cocoonデフォルトで存在しないURLにアクセスした場合、以下のように簡素な404ページが表示されます。

Cocoonデフォルトの404ページ設定

以下では、404ページを独自に設定し、他サイトと差別化する方法を紹介します。

スポンサーリンク

404ページの変更

404ページのメッセージや画像を変更するには、テーマ設定画面を開きます。

WordPress管理画面から「Cocoon設定」を選択してください。

Wordpress管理画面からCocoon設定を選択

「404ページ」タブを開いて画像やメッセージを変更して保存します。

Cocoonで404ページのカスタマイズ

こんな感じでメッセージや画像を変更することができます。

404ページのカスタマイズ後

ウィジェットを挿入する

ウィジェット設定で、ある程度コンテンツも挿入できます。

WordPress管理画面から「外観→ウィジェット」を選択します。

Wordpress管理画面から外観→ウィジェットを開く

あとは、「404ページウィジェットエリア」にお好みのウィジェットを挿入すれば、巡回を促すような作りにもできます。

404ページウィジェットエリアにウィジェットを挿入する

以下のように設定したウィジェットが表示されます。

サイト巡回を促す404ページ例

ショートコードを使った応用

テキストをウィジェットを挿入して、カラム分けとショートコードを利用することもできます。

404ページエリアにテキストウィジェットとショートコードを用いた応用例

サンプルコードはこちら。

<div class="column-wrap column-2">
  <div class="column-left">
    <h3>新着記事</h3>
    [new_list]
  </div>
  <div class="column-right">
    <h3>人気記事</h3>
    [popular_list]
  </div>
</div>

すると以下のように、2カラム分けして「新着記事リスト」と「人気記事リスト」を表示することも可能です。

2カラムで404ページを作り込む

カラム分けや、記事リストショートコードの使い方はこちらを参照してください。

記事内を2カラム・3カラム・4カラムに分ける方法
投稿記事内に手軽に2カラム・3カラムレイアウトを挿入する方法です。ビジュアルエディターからクリック操作のみで入力可能です。
新着記事一覧を表示するショートコードの利用方法
新着記事ウィジェットのようなリスト表示を実現できるショートコードの利用方法です。
人気記事一覧を表示するショートコードの利用方法
人気記事ウィジェットのようなリスト表示を実現できるショートコードの利用方法です。
テーマ設定ウィジェット
スポンサーリンク
わいひら

無料WordPressテーマ、Simplicity、Cocoonを作成。当サイトと寝ログを運営しています。

わいひらをフォローする
わいひらをフォローする
おすすめレンタルサーバー

性能も兼ね備えながら安くブログ運営を開始したいのであればここ1択。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越しオプションあり(有料)
サービス運営期間:1年1ヶ月

1年以上の契約をする場合は、クーポンコード入力でさらに10%割引(※2019/12/31まで)。

クーポンコード:PK4JK4RJ

クーポンの使用方法はこちら

プラン変更で負荷対策が行えるので、ブログ向きのレンタルサーバーです。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/2・QUIC(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎復元ポイントを指定して復旧可能(無料)
◎アダルト・出会い系サイト可
○サーバ引っ越しオプションあり(有料)
○サーバー料金をチャージ払いが可能
サービス運営期間:3年

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
△DBは7日分だけ無料復旧可能(ファイルは有料)
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可
サービス運営期間:16年

とにかく速い。サイトに表示スピードを求めるならココ。

◎nginxを用いた高速サーバー(完全SSD)
◎プランのアップ・ダウングレードが自由自在
◎ディスク容量が多い
◎転送量が多い
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
○DB復旧は無料(ファイルは有料)
○サーバ引っ越しツールあり
○サーバー料金をチャージ払いが可能
△新しいサービスなので運営櫪がまだ短い
サービス運営期間:11ヶ月

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
サイトを続けるうちにアクセスが増えれば、プランのアップグレートで対応可能です。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越しオプションあり(無料)
◎アダルト・出会い系サイト可
○http/2(高速化プロトコル)に対応
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)
サービス運営期間:3年

Cocoon

コメント テーマの質問はフォーラムへ

  1. 桃李 より:

    こんにちは。
    ロリポップサーバーはデフォルトでオリジナルのエラーページが設定されています。
    サーバー管理画面から「自作エラーページ」を指定できるのですが、 『URLまたはパスで入力してください』とあります。
    cocoon設定で保存した404ページを表示させるためのURLまたはパスはありますか?

  2. こんにちは。

    サーバーのエラーページを自作エラーページ500・503を作成して変更表示させてたことがあります。(設置までの工程など404もおそらく同じ)

    サーバー404エラーページが表示されるときは、テーマで指定したファイルが表示されない状態なので、Cocoonで保存した404ページの指定をしても、表示されなさそうです。

    パスの指定は、例えばwp-contentフォルダと同じ階層に置く場合 /404.php などパスを指定し、自作エラーテンプレートファイルをアップロードして初めて表示されます。

    このページは存在しませんよ。というのはテーマ側の404ページが表示され、サーバーの404ページが出るときは、例えば.htaccessファイルの記載を間違って消してしまったときなど…サーバーの404が見れると思います。

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