カテゴリー
WordPressカスタマイズ

オリジナルの403ページを表示しよう

403とはウェブページに対するリクエストへのサーバからのレスポンスコードです。
おもな原因は権限のないアクセスですが、WordPressでのプログラム的なエラーでも403でページにアクセスできなくなるケースが発生します。

WordPressサイト真っ白を復旧

403ページとは不吉なもの(笑
かならずしもそうでもないのですが、この記事はその解消方法ではなく、その際に表示するエラーページについての解説です。

WordPressで構築したサイトのほとんどはページが見つからない場合の404ページ(Page Not Found)が用意されています。
テンプレートに404.phpを用意することで任意のエラーページを表示させることができますが、許可されていないアクセスに対する403(Forbidden)はサーバのデフォルト表示になります。
どうせなら、403エラーもオリジナルページを表示させたいものですよね。

デフォルトの403ページ

レンタルサーバなどホスティングサービスであらかじめ用意されている403ページはやはり味気ないです。
たとえば、ロリポップだとこんな感じです。
コーポレートやECサイト系ではいただけませんよね。

ロリポップの403ページ

オリジナルの403ページを表示

ということで、403エラー時にオリジナルページを表示させてみましょう。
htaccessを使える場合は手順としてはそれほど難しくなく、基本は下記の2工程のみです。

  1. ページを用意
  2. エラー発生時にこのファイルを表示させる

403.hmtlを静的HTMLファイルとして作成してルート直下にアップロードします。
シンプルに文字コードとviewportの指定のみで書くと、このような感じでしょうか。

<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1"> </head>
<body>
  <div>
    <h1>HTTP 403 Error</h1>
    <h2>Forbidden</h2>
  </div>
</body>
</html>

この場合のhtaccessへの追記は以下です。

ErrorDocument 403 /403.html

WordPressの場合は404のようにテーマ内に403テンプレートを用意する方法もあります。

ErrorDocument 403 /wp-content/themes/themes-name/403.php

念のためにステータスコードが転送の301ではなく、きちんと403が返ることを確認ください。
ステータスコードチェッカー
ダンプ出力してステータスコードを確認することもできます。

<?php var_dump(http_response_code());?>
※Xserverのように、エラーページはコントロールパネル上で設定を行う必要があるケースもあるようです。
htaccessでの指定でうまくいかない場合は各サービスに確認ください。

意図的に403を発生させる

検証のために403発生させる必要がありますね。
基本的に閲覧権限のないファイルへのアクセスは403となりますので、test.htmlなど適当なファイルをサーバ内に設置して、パーミッションを660や640にします。
このファイルにアクセスすることで意図的に403を発生させることができます。

403ページの例

サンプルとしてこのサイトのルート直下にjsという一般のアクセスを許可していないフォルダを作成していますので、アクセスしてみてください。
オリジナルの403ページが表示されます。
https://seous.info/js/

ちなみにこちらはこのサイトのダッシュボードへの通常のログインURLです。
https://seous.info/wp-login.php

わたしは乗っ取り被害の多いWordPressのログインURLは自前の仕組みで変更しており、wp-login.phpへのアクセスにも403を返しています。

この403はシンプルなページですが、ベースにされたい方はご自由にお使いください。
画像もBase64でエンコードしてHTMLに埋め込んでおり、1ファイルで完結します。
テーマに追加、かつ、PHPで何らかの制御を行う場合は403.phpとして、必要な追記を行います。
403ページサンプルダウンロード

エラーページにもオリジナリティが必要!?

実際のところ、意図的に403にアクセスしてくるユーザーは微妙です。
ただ、404などのエラーページはアクセスしたユーザーが困らないように案内するというのはもちろんのこと、せっかく拾ったアクセスを有効につなげるという意識は大切でみなさん工夫されているようです。

リコメンドを意識して人気記事をリスト表示する、ショップ系だと売れ筋商品を掲載するなど、その先を見てみようという工夫がエラーページにも必要ですね。
魅力的なエラーページのサイトを探してみてもおもしろいかもしれませんね!

profile image

執筆:R3098

WEBサービス構築・監修が生業です。WordPress 関連では Aurora Heatmap などのプラグイン開発も行っています。サイト運営者の力になりたいと考えます。

コメントを残す

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

このサイトは reCAPTCHA によって保護されており、Google のプライバシーポリシー および 利用規約 に適用されます。

reCaptcha の認証期間が終了しました。ページを再読み込みしてください。