BAC Software Consulting Blog

How To Put Your WordPress Website in Maintenance Mode Without a Plugin

How To Put Your WordPress Website in Maintenance Mode Without a Plugin

In this tutorial, I will show you how to easily redirect your visitors to a temporary maintenance page without the need of a plugin. The custom maintenance page lets your visitors know that your WordPress Website (or blog) is down for maintenance. Logged-in administrators will still have full access to the Website while visitors see a customized maintenance message.

From time to time you may have to bring down your WordPress Website for maintenance. For instance, If you want to redesign, add new features, change the layout or other significant changes to your Website, then you don´t want your visitors to see your “in progress” changes or broken Web pages. In order to prevent your users from seeing a broken version of your Website, it is crucial that you redirect visitors to a temporary maintenance page.

What about a plugin?

Yes, there are plugins that redirect visitors to a custom maintenance page. But I encourage you to read my previous post about unnecessarily adding plugins to your theme.

There are 2 scenarios when a Website is put into maintenance mode:

  1. Automatic: Executed during an automatic WordPress version update from your dashboard.
  2. Manual: Executed by you at any time you see fit.

1. Automatic Maintenance Mode (Done by WordPress)

When you are performing an automatic WordPress version update from your dashboard, WordPress temporarily puts the Website in maintenance mode until the upgrade is complete.

2. Manual Maintenance Mode (Done at Anytime by You)

The second scenario is when, at a time of your choosing, want to put your Website in maintenance mode. let´s say you are adding custom functionality to your Website and you need an hour to finish the task. This is where you can put your Website into maintenance mode.

Final Result | Manual Maintenance Mode

The picture below shows the temporary maintenance page that your visitors will see, while at the same time logged-in administrators still have full access to the Website.

Features of The “Manual Maintenance Mode” Code

What does my Code do? It adds a maintenance page to your WordPress Website that lets visitors know your Website is down for maintenance. Logged-in administrators (and Super Admins) can continue to work on the Website behind the scene and view those edits online. At the same time, all your visitors and other users only see the maintenance page.

Here are few features of the code:

  1. The code has to be manually activated and deactivated.
  2. Visitors will see a customized, user-friendly maintenance message.
  3. Maintenance message is customizable. You can edit the message as you see fit. For instance, you can specify the time that your Website will be down for maintenance.
  4. Logged-in administrators and Super Admins, get full access to the Website (dashboard/back-end and front-end).
  5. The title of the maintenance page (which also appears on the browser´s tab) is customizable.
  6. Code is tested to work properly on WordPress Version 2.8 and newer.
  7. Code is tested to work properly with all major browsers.

“Manual Maintenance Mode” Code | functions.php

When you are ready to put your Website in Maintenance mode, open the functions.php file located in your theme´s folder, and add (copy and paste) the following code (CODE-1). Your WordPress Website is now NOT available to anyone except administrators.

CODE-1:

<?php
function activate_maintenance_mode() {
    //If the current user is NOT an 'Administrator' or NOT 'Super Admin' then display Maintenance Page.
    if ( !(current_user_can( 'administrator' ) ||  current_user_can( 'super admin' ))) {
        //Kill WordPress execution and display HTML maintenance message. 
        wp_die('<h1>Website Under Maintenance</h1><p>Hi, our Website is currently undergoing scheduled maintenance. 
        Please check back very soon.<br /><strong>Sorry for the inconvenience!</strong></p>', 'Maintenance Mode');
    }
}
//Hooks the 'activate_maintenance_mode' function on to the 'get_header' action.
add_action('get_header', 'activate_maintenance_mode');
?>

CODE-1 Notes:

When you are finished with your Website´s maintenance, make sure to disable maintenance mode by commenting outline 18 of the code. Test to make sure that your Website is back online. No need to remove the code from your functions.php file.

WordPress will not know your role unless you are logged-in to your WordPress dashboard.

If you render your Website in a different browser than where Administrators and Super Admins are logged-in, then the Website will be in maintenance mode. WordPress does not know that you are logged-in in a different browser.

The second parameter of the wp_die() function define the $title variable. This is the HTML title tag of the maintenance page which also appears on the browser´s tab. This is customizable and is better than the default $title variable (´WordPress > Error´). For instance, you can change the $title variable to Your blogname – Maintenance Mode.

wp_die() function accepts some HTML formatting.

CODE-1 works for WordPress 2.8 and above. But I hope that you will upgrade to the latest WordPress version.

General Warning

When you add several PHP code blocks in your theme´s funtions.php file, make sure that you do NOT leave any white space (spaces, newline) before the opening PHP tag (<?php) or after the closing PHP tag (?>). The correct way is like so:

<?php 
//Some Code here beetween the opening PHP tag (above) 
//and the closing PHP tag (below)...
?>
<?php 
//Some other Code here ...
?>

In the above code, if you leave any white space or a newline between lines 4 and 5, you will get the following error: “Warning: Cannot modify header information – headers already sent by…”

HELP! I got stuck in Maintenance Mode. What Should I do?

First don´t panic! It is counter-productive.

  1. If you manually put your wordPress Website in Maintenance mode, using my code (CODE-1), then make sure to go to your functions.php file located in your theme´s folder and comment out line 18 of CODE-1. This will disable the function.
  2. If you were doing an automatic WordPress version update from your WordPress dashboard, then that´s a different and unrelated story. In this case, make sure to manually delete the .maintenance file using your FTP software, then do a manual WordPress upgrade.
    Note that the .maintenance file is located in the root of your WordPress install (same level as wp-settings.php). See the references below for more details.

Your Turn to Talk

At some point, every Website has to perform maintenance of some sort that requires taking the Website offline for sometime. The best way to do that is to keep your visitors informed by redirecting them to a temporary customized maintenance page, and all this without the need of a plugin.

How easy did you find this tutorial to implement? Do you have something to add or anything else to say?

How To Display & Modify Allowed HTML Tags in WordPress Comments

How To Display & Modify Allowed HTML Tags in WordPress Comments

In this tutorial I will show you how to display the WordPress default allowed HTML Tags list for the comment form on your WordPress blog, as shown in the image below:

Also, I will show you how to modify the allowed HTML tags and attributes list to fit your needs. I will show you how to remove tags from the default list and how to add HTML tags to the list for the Comment textarea in WordPress.

Do you know that readers can use some HTML tags in the comment section? Specifically in the Comment´s textarea? To make things easier for your readers, you should notify them about what HTML tags they can use in the comment form.

Display/Show Allowed (X)HTML Tags in WordPress Comments

In order to make things convenient for your readers, you should notify them about what (X)HTML tags they can use in the comment form. Here is a simple way to do it.

Open comments.php file located in your theme´s folder, and add the following CODE-1 to below the comment´s textarea. Save the file and upload it to the server.

CODE-1 :: comments.php File

<!-- Displays all of the WordPress default allowed HTML tags with attributes.-->
<p><strong>XHTML:</strong> You can use: <code><?php echo allowed_tags(); ?></code></p>

CODE-1 Reference:

allowed_tags()

The allowed_tags() function is defined in wp-includes/general-template.php of your WordPress directory. This function calls the $allowedtags global variable defined in wp-includes/kses.php. The allowed_tags() function displays all of WordPress default allowed HTML tags with their respective attributes.

It is preferable to use CSS for styling as a better approach than using the <strong> tag.

In some themes, the allowed_tags() function is just commented out. In this case, all you have to do is Uncommenting that line of code, in order to show what HTML tags are allowed to use in the Comment textarea.

If the below line of code (or something similar) already exists in your theme´s comments.php file, then all you have to do is to Uncomment it (meaning remove <!–– from the beginning of the line AND ––> from the end of the Line. That´s ALL.

<!--<p><small><strong>XHTML:</strong> You can use these tags: 
<code><?php echo allowed_tags(); ?></code></small></p>-->

Note: The allowed_tags() function merely shows the user what are the allowed HTML tags for WordPress comment textarea. Commenting this function out or removing it from comments.php file does not prevent a knowledgeable WordPress user from using the default WordPress allowed HTML tags in the Comment textarea. This function merely displays the tag on the browser´s window, it does not prevent the user from using them. Hidden tags does not mean that they can´t be used.

Real Example | Diary Theme

To give you an example. One of the themes I am using for this Blog is the Diary Theme. Below is where I added CODE-1 in the comments.php file. Some sections of the file are removed for brevity.

comments.php File :: Diary Theme

Note: To scroll within the code, you can also click on the code window and use your keyboard´s arrow keys.

<?php
// Diary theme. Do not delete these lines.
     
    /* CODE REMOVED FOR BREVITY. */
?>
 
<!-- You can start editing here. -->
 
<?php if ( have_comments() ) : ?>
    <!-- CODE REMOVED FOR BREVITY. -->
 
<?php if ('open' == $post->comment_status) : ?>
 
<div id="respond">
 
<h2 id="commentsForm" class="clear"><?php comment_form_title( 'Anything to say? Leave a comment!', 'Leave a comment to %s' ); ?></h2>
 
<div class="cancel-comment-reply">
    <small><?php cancel_comment_reply_link(); ?></small>
</div>
 
<!-- CODE REMOVED FOR BREVITY. -->
 
<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
<fieldset>
 
<!-- CODE REMOVED FOR BREVITY. -->
 
<?php else : ?>
 
<p><label for="author">Name <?php if ($req) echo "(real name, or name@keywords)(required)"; ?></label>
<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1" <?php if ($req) echo "aria-required='true'"; ?> />
</p>
 
<p><label for="email">Mail (will not be published) <?php if ($req) echo "(required)"; ?></label>
<input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="22" tabindex="2" <?php if ($req) echo "aria-required='true'"; ?> />
</p>
 
<p><label for="url">Website</label>
<input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="22" tabindex="3" />
</p>
 
<?php endif; ?>
 
<p><label for="comment">Comment</label>
<textarea name="comment" id="comment" rows="10" tabindex="4"></textarea></p>
 
<!--****This is where I added CODE-1, immediately after the Comment textarea. -->
<!--Displays all of the WordPress default allowed HTML tags with attributes.-->
<p><strong>XHTML:</strong> You can use: <code><?php echo allowed_tags(); ?></code></p>
 
<p><input name="submit" type="submit" id="submit" tabindex="5" value="POST COMMENT" />
<?php comment_id_fields(); ?>
</p>
 
<?php do_action('comment_form', $post->ID); ?>
</fieldset>
</form>
<!-- CODE REMOVED FOR BREVITY. -->

How To: Remove HTML Tags from the Allowed Default List

As I said before, the default set of allowed HTML tags and attributes for blog comments are stored in the $allowedtags global variable.

If you want to remove some of the allowed HTML tags and attributes from the default list. You can either add CODE-2 to your functions.php, or you can hack the kses.php file. Of course, modifying the kses.php file is not advisable, since you will loose your changes on the next WordPress version upgrade.

General Warning

When you add several PHP code blocks in your theme´s funtions.php file, make sure that you don´t leave any white space (spaces, newline) before the opening PHP tag or after the closing PHP tag. Like so (the correct way):

<?php 
//Some Code here beetween the opening PHP tag (above) 
//and the closing PHP tag (below)...
?>
<?php 
//Some other Code here ...
?>

In the above code, if you leave any white space or a newline between lines 4 and 5, you will get the following error: Warning: Cannot modify header information – headers already sent by (… , in your login screen and after you login to your WordPress dashboard.

Your Turn to Talk

In this tutorial, I showed you how to display the allowed (X)HTML Tags in WordPress Comment section, to make it easier for your users. Also I showed how to unobtrusively modify the WordPress default Allowed Tags list for the Comment textarea by either removing tags from the default list or adding tags to the list.