How to Customize Maintenance Mode Page in Magento 2

Tired of the boring ‘Server Temporarily Unavailable’ maintenance page in your Magento 2 store? Here is how you can customize maintenance mode page in Magento 2 as you want! 🎨

Just like the physical stores, the Magento 2 stores require regular maintenance for smooth operations. The online store maintenance includes fixing bugs, and errors, adding new functionalities, and much more. There are high chances that the customer may encounter an error or have an unpleasant experience if they are allowed to access the webstore during maintenance.  A clever way to avoid that is to show an ‘Under maitenance’ page in Magento 2.

Magento 2 allows the admin users to enable the maintenance mode to carry out the operations such as bug fixing, customization, adding more features, etc. During this period, the customers are restricted from accessing the website by showing a ‘Service Temporarily Unavailable’ message (as shown below). You can do either of both, enable or disable maintenance mode in Magento 2, as per the errors and issues are taken and solved.

The message may serve its purpose for the developers and the store owners, but it may not be clear enough for the customers to understand.😴

As a result, it may deteriorate the customer experience and hamper the branding in the long go. Therefore, the store owners may seek a way to customize maintenance mode page in Magento 2.

In this blog post, I will provide you with a programmatic solution to change Magento 2 custom maintenance page.

Let’s begin!😃

How to Customize Maintenance Mode Page in Magento 2?

The Magento 2 coming soon page can be changed by tweaking the source code in the backend. The source code of the maintenance page, also known as the 503 page, is stored in a phtml file. Therefore, we need to access the file and change the code in order to customize maintenance mode page in Magento 2.

In the Magento 2 directory, go to pub\errors\default\ and open the 503.phtml, which is the source file of the maintenance page in Magento 2. Replace the code in the file with a Magento 2 custom maintenance page code and save it. For example, you can download our sample 503.phtml file to change the maintenance page in Magento 2, which will change your maintenance mode as shown below:

The manual method of editing the phtml file seems easy and quite straightforward to change maintenance mode page in Magento 2. However, it requires the knowledge of designing and coding, which can be a bit challenging for most store owners. Our Magento 2 Maintenance Page extension becomes a saviour for such store owners!

The extension makes it easy for store owners to create attractive and customized maintenance mode page in Magento 2. Some of the highlighted features of the extension are:

• Countdown Timer: Inform the visitors when your site will be back through a countdown timer on the maintenance page ⏳
• WYSIWYG Editor: Easily customize the content of the Magento 2 coming soon page using the WYSIWYG editor 📝
• Subscription Box: Add an email subscription box on the Magento 2 custom maintenance page and inform the subscribers when you are back 📩
• Social Media Buttons: The Magento 2 edit maintenance page supports adding social media buttons on the maintenance page and allows visitors to contact you 🔗

Final Words

The maintenance page in Magento 2 can be customized by tweaking the source file. You can easily replace the boring maintenance mode page in Magento 2 with an attractive one using the method provided above. I hope this solution will help you to customize maintenance mode page in Magento 2. Pour down your thoughts on this solution in the comments section below, I’d be happy to interact with you. 😀

Also, do not forget to share this blog post with your Magento 2 friends via social media! 😄

Thanks for reading! 🍀