カスタム404ページ

2017年3月11日 ashmaroli ashmaroli

Jekyllでは、サイトの壊れたリンクにアクセスしようとしたときに表示されるデフォルトの**エラー404 - ファイルが見つかりません**ページを置き換えるカスタム404エラーページを簡単に提供できます。

GitHub Pagesの場合

**`_site`ディレクトリのルート**にある`404.html`は、GitHub PagesおよびローカルのWEBrick開発サーバーによって自動的に提供されます。

サイトのソースディレクトリのルートに`404.md`または`404.html`を追加し、テーマの基本レイアウトを使用するためのフロントマターデータを含めます。

ファイルをサブディレクトリ以下に整理する場合は、エラーページに次のフロントマターデータを設定する必要があります: `permalink: /404.html`。これは、コンパイルされた`404.html`が処理済みサイトのルートに配置され、サーバーによって選択されるようにするためです。

---
# example 404.md

layout: default
permalink: /404.html
---

# 404

Page not found! :(

Apache Webサーバーでホスティングする場合

Apache Webサーバーは、これらのサーバーの機能を変更する`.htaccess`という名前の設定ファイルを読み込みます。

`.htaccess`ファイルに以下を追加するだけです。

ErrorDocument 404 /404.html

`.htaccess`ファイルを使用すると、エラーページをサブディレクトリ内に配置できます。

ErrorDocument 404 /error_pages/404.html

パスはサイトのドメインからの相対パスです。

Apacheエラーページの設定に関する詳細は、公式ドキュメントを参照してください。

Nginxサーバーでホスティングする場合

手順はApacheサーバーの設定と同じくらい簡単ですが、少し異なります。

nginx設定ファイルは、インストールされているシステムによって異なります。 ほとんどのシステムでは、`nginx.conf`ファイルで、通常は`/etc/nginx/`または`/etc/nginx/conf/`内にあります。 ただし、Ubuntuなどの他のシステムでは、サーバー関連情報を含む`default` nginx設定ファイルを探す必要があります。これは通常、`/etc/nginx/sites-available/`または`/etc/nginx/sites-enabled/`内にあります。 nginx設定ファイル、つまり`nginx.conf`ファイルまたは`default`ファイルに以下を追加します。

server {
  error_page 404 /404.html;
  location = /404.html {
    internal;
  }
}

`server`ブロックが既に存在する場合は、上記の`server`ブロック内にのみコードを追加します。 `location`ディレクティブは、ユーザーが404.htmlページを直接閲覧することを防ぎます。

nginxエラーページの詳細については、nginx公式ドキュメントを参照してください。

設定ファイルを編集する際は注意してください。