maintain.htmlなどのファイルを作る
まずは閲覧者にメンテナンス期間中に表示するページのhtmlファイルを用意します。例として下記のような形です。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, maximum-scale=1.0">
<meta name="format-detection" content="telephone=no">
<title>メンテナンスページ</title>
<meta name="robots" content="noindex,nofollow">
<meta name="description" content="">
</head>
<body id="top">
<div id="page">
<div style="text-align: center; margin-top: 5rem;">
<p>現在サイトリニューアルのため<br>一時的にクローズしています。</p>
<p>ご不便をおかけ致しますが、<br>今しばらくお待ちください。</p>
</div>
</body>
</html>.htaccessにリダイレクト設定をする
その後、特定のIPアドレス以外からのアクセスを上記で作ったmaintain.htmlにリダイレクトする設定を.htaccessに記述します。
ErrorDocument 503 /maintain.html
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_URI} !=/maintain.html
RewriteCond %{REMOTE_ADDR} !=oo.oo.oo.oo
RewriteCond %{REMOTE_ADDR} !=oo.oo.oo.oo
RewriteRule ^.*$ - [R=503,L]
</IfModule>oo.oo.oo.ooのところは閲覧可能なアクセス元グローバルipになります。
該当ディレクトリに上記２ファイルをアップする
上記の２ファイルを公開ディレクトリにアップします。そうするとmaintain.htmlに強制的にリダイレクトされると思います。下層ページにアクセスした場合もリダイレクトされます。
画像などはbase64で記述すれば可能。
そうなると画像やcssなどのパスも無効になってしまいます。そこでもし画像をメンテナンスページに表示したい場合はbase64にterminalなどで返還して使うことができます。
base64 filepath.pngなどで生成した文字列をimgのソースに設定しましょう。
<img src="data:image/png;base64,iVBO.........まとめ
以上、簡単に説明いたしました。WordPressなどのプラグインなどでもメンテナンスページは表示できますが、この方法を知っておくといろんな環境で対応できますので便利です。
