Set Website To and From Maintenance Mode using Ajax, Jquery and PHP

This tutorial helps and teaches you how to design a nice system where you can set your websites to maintenance mode so as to carry out your maintenance activities and also remove your websites from maintenance mode when you are done with your maintenance work using Ajax, Jquery and PHP.

The system works with MYSQL Database and uses a simple and nice looking switch that triggers two radio buttons within a div for turning On and Off your websites mode for maintenance work.

If JavaScript is disabled on your browser, the script will just display the two radio buttons with their labels which are On and Off.

The word "On" means to set the website to maintenance mode and "Off" means to remove the website from maintenance mode.

When you set your website to maintenance mode by clicking on the On option of the switch or radio button, the system will auto take the IP Address of your computer being the Administrator of your website and save it in the database along with your website status which is maintenance mode so as to allow you alone being the administrator of the system to access any part of the website to carry out your maintenance work while any other user or visitor that visits the website is redirected to a page set with nice information telling the user or visitor that the website is currently under maintenance and would be right back in a while.

I am sure you guys understand what i am actually talking about, Good!

To configure the system to work on all the pages of your website so as to check when you have set your website to maintenance mode and redirect your users or visitors appropriately to your nicely designed maintenance mode page, simply include the file named "vpb_maintenance_mode.php" on all your website pages as done in the page named "website_test_page.php".

Then, follow the steps taken in the index.php file which is assumed to be your demo admin panel to add the codes in this file to your main website admin panel page to have this feature for your websites.

The steps taken in the index.php file is very simply, to move the codes in this file to your main website admin panel page, just copy the codes which are between the html comment tag that says "Code Begins Here" and "Code Ends Here" to the body section of your main website admin panel page and copy the three links at the head section of this index.php page to the head section of your own main website admin panel page and you are done with this page.

It is very important that you read all the comments i have written in the scripts to understand how the system actually works.