How to create a custom maintenance mode plugin for your WordPress site

When we talk about maintenance or under construction pages for WordPress, we like to recommend plugins which can help you with the job. The truth is that there really are some amazing under construction page plugins for WordPress, and you can get many of them for free. In the same situations, we like to say that getting a plugin is a much better and faster solution than building your own. That’s still true, but how do you build a custom maintenance mode plugin for your WordPress site?

We finally decided to show you how to create one by yourself. And a good thing about creating your custom maintenance mode plugin is that you don’t have to be a developer. We will prepare everything for you; all you need is some time and will to follow a few steps. In the end, you might want to change some text, images and overall styles (you will have to have some basic CSS skills for the customization in that case) and you can create a simple plugin within ten minutes.

A few things you might need

Besides local installation or access to a WordPress site, you won’t need anything else. But to make everything easier, here are a few things that will help you if you prepare them now:

  • Text editor like Notepad++ or Notepad2
  • FTP access
  • ZIP software
  • A nice background image

Create a custom maintenance mode plugin for WordPress

If you have prepared yourself for some work, we can start molding a custom plugin. Yeah, we know, it’s hard to start without having a clue what’s the maintenance page going to like so take a glance at what the following code will get you.
Custom maintenance mode plugin for WordPress

1. Create the plugin

To make everything easier and faster, we suggest that you work locally. Once you complete the last step, you will be able to upload your plugin via WordPress or place it in the right folder via FTP. For now, relax and forget about that part.

  1. Create a new folder and name it something like “custom-maintenance”
  2. Inside the new folder, create a new file “custom-maintenance.php”
  3. Copy and paste the following code into the file and save changes:
<?php
/*
* Plugin Name: Custom Maintenance by WP Loop
* Plugin URI: https://firstsiteguide.com
* Description: Show an under construction page to users who are not logged in.
* Version: 1.0
* Author: WP Loop
*/

function maintenance_mode() {
global $pagenow;
if ( $pagenow !== 'wp-login.php' && ! current_user_can( 'manage_options' ) && ! is_admin() ) {
header( $_SERVER["SERVER_PROTOCOL"] . ' 503 Service Temporarily Unavailable', true, 503 );
header( 'Content-Type: text/html; charset=utf-8' );
if ( file_exists( plugin_dir_path( __FILE__ ) . 'maintenance.php' ) ) {
require_once( plugin_dir_path( __FILE__ ) . 'maintenance.php' );
}
die();
}
}

add_action( 'wp_loaded', 'maintenance_mode' );

As you can see, the code for this plugin is very simple. Once you copy it, feel free to change the name of your plugin on top. The name you enter here will be displayed in the list of plugins once you upload it to your WordPress. Don’t forget to change the URL, description, version number and author.

The code checks for WordPress pages and users; the maintenance mode page that we are about to create will be displayed on all pages but the wp-login page (we guess you want to be able to log in). It will also show for all users but the administrator.

2. Create the template

As you can see from the previous code, the plugin will search for maintenance.php file. This is the template that we are about to create. Here, you can display any code that you want, add any text, images or whatever else you want. For the tutorial purposes, we will keep things simple:

  1. Open “custom-maintenance” folder
  2. Create a new file “maintenance.php”
  3. Open the file and copy the following code:
Under Construction

Oh noo, we're under attack!

We will be back when we rebuild and tame the monster.

In the next step, we’re about to create a stylesheet for our new maintenance mode page.

3. Style the maintenance page

Technically, you can create a custom maintenance mode plugin even without a stylesheet. But since you’ve already invested some time into building something on your own, you don’t want the page to look ugly. So, we suggest that you continue with this step and create a stylesheet that will make your maintenance page much better:

  1. Open the”custom-maintenance” folder
  2. Create a new folder called “CSS”
  3. In the “CSS” folder, create a file “maintenance.css”
  4. Edit the file with Notepad++ or any other editor
  5. Copy the following code and modify it if needed
html {
            padding: 20px;
            font-size: 25px;
            line-height: 1.4;
            color: red;
            background: #f0f0f0;
        }
 
        html,
        input {
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
background-image: url("https://www.walldevil.com/wallpapers/a47/wallpaper-cartoons-fresh-cartoonish-buildings-cityscapes-images.jpg");
background-position: 10% 10%;
        } 
        h1 {
            margin: 0 10px;
            font-size: 30px;
            text-align: center;
            color: #cf3404;
        }
 ul {
 color: black;
 }

4. Upload your new plugin

After spending some time on customizing the plugin, don’t forget to save all the changes. Because you’re officially done! Yes, that’s was it. You’re just step away from having a custom maintenance page on your site.

  1. Select the entire custom-maintenance folder
  2. Create a ZIP archive
  3. Navigate to Plugins -> Add New -> Upload Plugin and select the ZIP file you created
  4. Activate the plugin from the list

Alternatively, you can access your site via FTP. Navigate to wp-content -> plugins and copy the entire custom-maintenance folder there. Then open the list of all plugins on your site and activate the plugin.

5. Let your visitors enjoy the under construction page

From the moment you activate the plugin, you have activated the maintenance mode as well. To see how your custom page looks, just open any page on your site (except the wp-login.php page), and make sure that you’re not logged in. Voila!


To make things easier for you, we made the plugin available for download. If you like it, feel free to download the plugin, make any changes you want and don’t forget to show us your results.

Download the custom plugin

Feel free to download the plugin we created in this example.

As you can see, creating a custom maintenance mode plugin isn’t that hard. But if you want more control over the mode, styles and access options, we suggest that you leave developing to the professionals because they already created a perfect under construction page plugin that you can use for free.

START YOUR OWN BLOG

This guide is an introduction to mastering the art of blogging. It provides easy to follow steps to start, maintain, and grow your blog.

Read the guide

One thought on “How to create a custom maintenance mode plugin for your WordPress site

  1. […] about developing new pages, but how do you create one? If you're a WordPress beginner, creating a custom maintenance plugin will be out of your reach. But don't worry; we are about to show you one of the best free […]

Leave a Reply

Your email address will not be published. Required fields are marked *