A Better Maintenance Page with Bypass for WordPress

After using many wordpress maintenance mode plugins I decided that they all had a problem in that they relied on the database to either redirect or display a maintenance page. If the site is going into maintenance mode so you can work on the database then this could present a problem.
The following maintenance mode code is easy to turn on and off via a URL and simple to implement, it also utilises a cookie bypass to allow you to continue working on the site whilst everyone else is presented with a simple maintenance page and reports a 503 Service Unavailable to search engines.

Once complete you will have the following maintenance mode options via a URL:

To enter into maintenance mode and set bypass cookie which allows access to the site whilst in maintenance:
domain.com/maintenance-switch.php?key=MY-SECRET-KEY&mode=enable

To exit from maintenance mode:
domain.com/maintenance-switch.php?key=MY-SECRET-KEY&mode=disable

To just set the bypass cookie which allows access to the site whilst in maintenance:
domain.com/maintenance-switch.php?key=MY-SECRET-KEY

Step 1: Create the maintenance page.

Copy the code below and edit it to your needs, at the very least you should change the domain.com and phone number elements.
Save the code as maintenance.php and upload it to your website root so that it can be accessed via domain.com/maintenance.php
The maintenance.php has a redirect so that after 30 second the visitor is redirected to the homepage unless it’s still in maintenance mode.

Tip:
You can also copy maintenance.php and rename it to db-error.php then upload to domain.com/wp-content, this will be automatically displayed instead of the not very helpful Error Establishing a Database Connection text in the event of this error occurring.

[pastacode lang=”php” manual=”%3C%3Fphp%0A%2F**%0A%20*%20Version%3A%201.0%0A%20*%20Date%3A%2030%2F03%2F2018%0A%20*%20Source%3A%20https%3A%2F%2Fdeanandrews.uk%2Fsimple-maintenance-page%2F%0A%20*%2F%0Aheader(%22HTTP%2F1.1%20503%20Service%20Temporarily%20Unavailable%22)%3B%0Aheader(%22Status%3A%20503%20Service%20Temporarily%20Unavailable%22)%3B%0Aheader(%22Retry-After%3A%203600%22)%3B%0A%0Aheader(%22Cache-Control%3A%20no-store%2C%20no-cache%2C%20must-revalidate%2C%20max-age%3D0%22)%3B%0Aheader(%22Cache-Control%3A%20post-check%3D0%2C%20pre-check%3D0%22%2C%20false)%3B%0Aheader(%22Pragma%3A%20no-cache%22)%3B%0A%3F%3E%0A%3C!DOCTYPE%20html%3E%0A%3Chtml%3E%0A%3Chead%3E%0A%09%3Ctitle%3E503%20Service%20Temporarily%20Unavailable%3C%2Ftitle%3E%0A%09%3Cmeta%20http-equiv%3D%22refresh%22%20content%3D%2230%3BURL%3D’https%3A%2F%2Fdomain.com%2F’%22%20%2F%3E%20%0A%09%0A%3Cstyle%20type%3D%22text%2Fcss%22%3E%0A%0Abody%20%7B%0A%09padding%3A%200%3B%0A%09margin%3A%200%3B%0A%09background%3A%20%23719430%3B%0A%09font-family%3A%20’Source%20Sans%20Pro’%2C%20sans-serif%3B%0A%7D%0Abody%20a%20%7B%0A%09transition%3A%200.5s%20all%3B%0A%09-webkit-transition%3A%200.5s%20all%3B%0A%09-moz-transition%3A%200.5s%20all%3B%0A%09-o-transition%3A%200.5s%20all%3B%0A%09-ms-transition%3A%200.5s%20all%3B%0A%09text-decoration%3A%20none%3B%0A%7D%0Abody%20a%3Ahover%20%7B%0A%09text-decoration%3A%20none%3B%0A%7D%0Abody%20a%3Afocus%2C%20a%3Ahover%20%7B%0A%09text-decoration%3A%20none%3B%0A%7D%0Ah1%2C%20h2%2C%20h3%2C%20h4%2C%20h5%2C%20h6%20%7B%0A%09margin%3A%200%3B%0A%09padding%3A%200%3B%0A%09text-align%3A%20center%3B%0A%7D%0Ap%20%7B%0A%09margin%3A0%3B%0A%7D%0A%0Aa%3Afocus%2C%20a%3Ahover%20%7B%0A%09text-decoration%3A%20none%3B%0A%09outline%3A%20none%0A%7D%0A%0A.main%7B%0A%09width%3A80%25%3B%0A%09margin%3A70px%20auto%200px%20auto%3B%0A%09text-align%3Acenter%3B%0A%7D%0A%0A.main%20h1%7B%0A%09font-size%3A170px%3B%0A%09font-weight%3A400%3B%0A%09color%3A%23fff%3B%0A%7D%0A%0A.main%20h2%2C%20h3%7B%0A%09margin%3A30px%200px%3B%0A%09font-size%3A28px%3B%0A%09font-weight%3A400%3B%0A%09color%3A%23fff%3B%0A%7D%0A%0A.footer%7B%0A%09text-align%3Acenter%3B%0A%09margin-top%3A35px%3B%0A%7D%0A.footer%20p%7B%0A%09font-size%3A16px%3B%0A%09color%3A%23fff%3B%0A%7D%0A.footer%20a%7B%0A%09color%3A%23fff%3B%0A%0A%09border%3Anone%3B%0A%09padding%3A0%3B%0A%7D%0A.footer%20a%3Ahover%7B%0A%09color%3A%23000%3B%0A%7D%0A%0A%40media(max-width%3A996px)%7B%0A%09.main%20%7B%0A%09%09width%3A%2076%25%3B%0A%09%7D%0A%09.main%20h1%20%7B%0A%09%09font-size%3A%2095px%3B%0A%09%7D%0A%7D%0A%0A%40media(max-width%3A600px)%7B%0A%09.main%20%7B%0A%09%09width%3A%2076%25%3B%0A%09%7D%0A%09.main%20h1%20%7B%0A%09%09font-size%3A%2080px%3B%0A%09%7D%0A%7D%0A%0A%40media(max-width%3A480px)%7B%0A%09body%20%7B%0A%09%09min-height%3A%20464px%3B%0A%09%7D%0A%09.main%20%7B%0A%09%09margin-top%3A%2040px%3B%0A%09%7D%0A%09.main%20h2%20%7B%0A%09%09font-size%3A%2045px%3B%0A%09%7D%0A%09.main%20h1%20%7B%0A%09%09font-size%3A%2053px%3B%0A%09%7D%0A%09.main%20h3%20%7B%0A%09%09font-size%3A%2017px%3B%0A%09%7D%0A%09.footer%20%7B%0A%09%09margin-top%3A%2035px%3B%0A%09%7D%0A%7D%0A%3C%2Fstyle%3E%0A%3C%2Fhead%3E%0A%3Cbody%3E%0A%09%3Cdiv%20class%3D%22main%22%3E%0A%09%09%3Ch1%3EYOUR-DOMAIN%3C%2Fh1%3E%0A%09%09%3Ch2%3EOUR%20WEBSITE%20IS%20TEMPORARILY%20UNAVAILABLE!%3C%2Fh2%3E%0A%09%09%3Cdiv%20class%3D%22footer%22%3E%0A%09%09%09%3Ch3%3EOur%20sales%20team%20however%20are%20on%20hand%20between%208am%20-%205pm%20to%20take%20calls%20and%20orders.%3C%2Fh3%3E%0A%09%09%09%3Ch3%3ECall%20000%20000%200000%20or%20email%20%3Ca%20href%3D%22mailto%3Asales%40domain.com%22%3Esales%40domain.com%3C%2Fa%3E%3C%2Fh3%3E%0A%09%09%09%3Cp%3EThis%20page%20will%20redirect%20when%20the%20website%20becomes%20available%20or%20you%20can%20check%20back%20later.%3C%2Fp%3E%0A%09%09%3C%2Fdiv%3E%0A%09%3C%2Fdiv%3E%0A%3C%2Fbody%3E%0A%3C%2Fhtml%3E” message=”maintenance.php” highlight=”” provider=”manual”/]

Step 2. Edit the htaccess file.

Make a backup then edit domain.com/.htaccess file.
The following code block needs to be added to the very beginning of the file. You will need to change the text UNIQUE-COOKIE-NAME to something else of your choosing.

[pastacode lang=”apacheconf” manual=”%3CIfModule%20mod_rewrite.c%3E%0ARewriteEngine%20On%0ARewriteCond%20%25%7BHTTP_COOKIE%7D%20!maintenance-mode-bypass-UNIQUE-COOKIE-NAME%0ARewriteCond%20%25%7BDOCUMENT_ROOT%7D%2Fmaintenance.php%20-f%0ARewriteCond%20%25%7BDOCUMENT_ROOT%7D%2Fmaintenance.enabled%20-f%0ARewriteCond%20%25%7BSCRIPT_FILENAME%7D%20!maintenance.php%0ARewriteCond%20%25%7BSCRIPT_FILENAME%7D%20!maintenance-switch.php%0ARewriteRule%20%5E.*%24%20%2Fmaintenance.php%20%5BR%3D503%2CL%5D%0AErrorDocument%20503%20%2Fmaintenance.php%0AHeader%20Set%20Cache-Control%20%22max-age%3D0%2C%20no-store%22%0A%3C%2FIfModule%3E” message=”.htaccess” highlight=”” provider=”manual”/]

Step 3. Add the maintenance-switch file.

Copy the code below and change MY-SECRET-KEY. This is the key that will be included in the URL to enable and disable maintenance mode, also edit the UNIQUE-COOKIE-NAME to match as per above.
Save the code as maintenance-switch.php and upload it to your website root so that it can be accessed via domain.com/maintenance-switch.php

[pastacode lang=”php” manual=”%3C%3Fphp%0A%0A%2F%2F%20Get%20the%20key%20data%20from%20the%20URL%0Afunction%20CheckAccess()%7B%0A%20%20return%20%40%24_GET%5B’key’%5D%3D%3D’MY-SECRET-KEY’%3B%0A%7D%20%0A%0A%2F%2F%20If%20the%20key%20is%20incorrect%20block%20access%20to%20page%0Aif%20(!CheckAccess())%7B%0A%20%20header(‘HTTP%2F1.0%20404%20Not%20Found’)%3B%0A%20%20exit%3B%0A%7D%0A%0A%2F%2F%20Set%20defaults%0A%24cookie_name%20%3D%20%22maintenance-mode-bypass-UNIQUE-COOKIE-NAME%22%3B%0A%24cookie_value%20%3D%20%22enabled%22%3B%0A%24maint_file%20%3D%20%22maintenance.enabled%22%3B%0A%0A%2F%2F%20Set%20the%20bypass%20cookie%0Asetcookie(%24cookie_name%2C%20%24cookie_value%2C%20time()%20%2B%20(86400%20*%2030)%2C%20%22%2F%22)%3B%20%2F%2F%2086400%20%3D%201%20day%0A%0A%0Aswitch%20(%24_GET%5B’mode’%5D)%20%7B%0A%20%20%20%20case%20’enable’%3A%0A%20%20%20%20%20%20%20%20%24handle%20%3D%20fopen(%24maint_file%2C%20’w’)%20or%20die(‘Cannot%20open%20file%3A%20%20’.%24maint_file)%3B%0A%20%20%20%20%20%20%20%20echo%20%22Maintenance%20mode%20enabled%3Cbr%3E%22%3B%0A%20%20%20%20%20%20%20%20break%3B%0A%20%20%20%20case%20’disable’%3A%0A%20%20%20%20%20%20%20%20unlink(%24maint_file)%3B%0A%20%20%20%20%20%20%20%20echo%20%22Maintenance%20mode%20disabled%3Cbr%3E%22%3B%0A%20%20%20%20%20%20%20%20break%3B%0A%20%20%20%20default%3A%0A%20%20%20%20%20%20%20%20echo%20%22Maintenance%20mode%20bypass%20enabled%3Cbr%3E%22%3B%0A%20%20%20%20%20%20%20%20break%3B%0A%7D%0A%0A%3F%3E%0A” message=”maintenance-switch.php” highlight=”” provider=”manual”/]

How it works

When you visit the URL domain.com/maintenance-switch.php?key=MY-SECRET-KEY&mode=enable to enable maintenance mode.
MY-SECRET-KEY is checked to ensure you have access to run the code.
The bypass cookie is set (maintenance-mode-bypass-UNIQUE-COOKIE-NAME).
A file named maintenance.enabled is created on the hosting root (this file is the indicator to the htaccess file)

Any visitors to your site will now see the maintenance page. This is handled by the htaccess file that checks for the existence of the maintenance.enabled file in the root, if found and the cookie is not set then redirect to maintenance.php.

When you visit the URL domain.com/maintenance-switch.php?key=MY-SECRET-KEY&mode=disable to disable maintenance mode.
The previously created file named maintenance.enabled is deleted

Any visitors to your site will now see the site as normal. So basically if the file maintenance.enabled is the switch for enabling and disabling the maintenance mode and the cookie just allows you to bypass the rules set in the htaccess.

domain.com/maintenance-switch.php?key=MY-SECRET-KEY can be used to set the cookie for other developers to work on the site.