Sometimes, you may need to temporarily disable your WordPress website for maintenance or updates. Instead of using a plugin, you can add a simple maintenance mode with just a few lines of code. This approach keeps your site accessible to logged-in admins while displaying a “Not Available” message to all other users.
Lets get started.
Insert the following code into your WordPress theme’s functions.php file:
// Activate WordPress Maintenance Mode
function wp_maintenance_mode() {
if (!current_user_can('edit_themes') || !is_user_logged_in()) {
wp_die('Not Available.');
}
}
add_action('get_header', 'wp_maintenance_mode');
And there you have it! This code will simply display “Not Available.” on the front end:
Once you’re ready to bring your site back online, simply remove or comment out the code in the functions.php file. This approach is lightweight and effective for quick maintenance tasks, allowing your website to remain accessible only to you and other website admins. Plus, it doesn’t require the installation of additional plugins.
What This Code Does
current_user_can('edit_themes'): Ensures that only users with theme editing permissions (typically admins) can bypass the maintenance mode.
is_user_logged_in(): Verifies whether a user is logged in. If not, the site will show the maintenance message.
wp_die(): Displays a simple message (“Not Available”) to users without access.
Customizing Your Maintenance Message
You can replace ‘Not Available.’ with a more user-friendly message or even add HTML. For example:
wp_die('<h1>Site Under Maintenance</h1><p>We’ll be back shortly!</p>');
This is what you will see on the front end:
Coming Soon or Maintenance Mode HTML Template
If you are looking for a more design friendly approach, simply add your HTML template inside the wp_die() function as shown below:
// Activate WordPress Maintenance Mode
function wp_maintenance_mode() {
if (!current_user_can('edit_themes') || !is_user_logged_in()) {
wp_die('
<!DOCTYPE html>
<html>
<head>
<title>Site Under Maintenance</title>
<style>
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
height: 100vh;
max-width: 100%;
display: flex;
justify-content: center;
align-items: center;
color: #333;
text-align: center;
}
.maintenance-container {
max-width: 600px;
padding: 30px;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
border-radius: 15px;
}
h1 {
font-size: 2rem;
margin-bottom: 20px;
color: #000;
font-weight: bold;
}
p {
font-size: 1rem;
color: #555;
line-height: 1.5;
}
.divider {
height: 1px;
width: 100%;
background: #ddd;
margin: 20px 0;
}
</style>
</head>
<body>
<div class="maintenance-container">
<h1>We’re under maintenance!</h1>
<div class="divider"></div>
<p>
Our website is currently undergoing scheduled maintenance. <br>
We’ll be back soon!
</p>
</div>
</body>
</html>
');
}
}
add_action('get_header', 'wp_maintenance_mode');
Here’s a straightforward and user-friendly method to create a custom ‘Under Maintenance’ or ‘Coming Soon’ page for your website with no plugins required – just a few lines of code. Avoid the hassle of installing plugins that might pose security risks, consume unnecessary resources, and complicate your codebase.
