Magento 2 User Experience Extensions

  1. Home
  2. Docs
  3. Magento 2 User Experience Extensions
  4. Magento 2 Coming Soon & Maintenance Page
  5. User Guide

User Guide

1. Overview

Coming Soon & Maintenance Page for Magento 2 is a 2-in-1 extension.

On the one hand, it is designed for those having the plan to launch out Magento 2 websites. Instead of showing blank words like “We are coming soon!” it is a must to create an eye-catching Coming Soon page to earn loves of early audiences.

On the other hand, this extension is required whenever your websites are under downtime. Say goodbye the incommunicative default maintenance page. A dedicated message and a specific maintenance end time make a user-friendly experience.

2. How Does It Work?

Please go to Stores Configuration ⇒ BSS COMMERCE ⇒ Maintenance Page to start setting up.

2.1 General settings

general settings of maintenance page

  • In Enable Maintenance, select “Yes”/”No” to enable/disable the maintenance page.
  • In Whitelist IPs, enter IPs that are allowed to access to the whole website during the maintenance time. Those IPs are separated by a comma without space.
  • In Restrict URLs, enter URLs that visitors can still access during the maintenance time. Multiple URLs must be separated by a comma without space. Add a slash (/) after the URL of the home page.
  • In Redirect Page, select where to redirect customers during maintenance time:
404 Not Found

Homepage

Enable Cookies

Privacy Policy

About us

Customer Service

Custom Page

  • In Enable Google Analytics, choose Yes to enable Google Analytics tracking for the Maintenance page. Otherwise, choose No.

*Note:

  • Please turn off Magento 2 default maintenance mode (if any) before enabling BSS Coming Soon/Maintenance Page extension. Otherwise, there will be conflict and error
  • Custom Page is the customized maintenance page set as follows.

2.2 Layout

magento 2 maintenance page layout

There are two built-in layouts to choose from:

1 Column

magento 2 maintenance page

2 Columns

magento 2 maintenance page in 2 -column layouts

2.3 Background

magento 2 maintenance background

  • In Background Types, choose among three options:

+ Image: Upload one image to be the background of the custom page. Supported formats include jpg, jpeg, gif, png.

File size should not exceed the website’s maximum upload size. 1920×960 is the best-recommended size.

+ Slider: Upload multiple images to slideshow the background every 5 seconds. After clicking the “Choose Files” button, hold “Ctrl” and choose as many images as wanted. Supported formats include jpg, jpeg, gif, png.

File size should not exceed the website’s maximum upload size. 1920×960 is the best-recommended size.

+ Video: Upload one video to be the page background. Supported formats include mp4 and WebM. Please verify your upload_max_size PHP value. If the video size is greater than this value, the video will not be uploaded

2.4 Logo

logo settings

  • In Icon, click “Choose File” to add any images to the Coming Soon/Maintenance page. It is recommended to upload your Logo – the brand equity.
  • Feel free to customize Icon Width and Icon Height to fit your page the most. We recommend entering the original sizes of the uploaded image.

2.5 Set up a countdown timer

A countdown timer is an essential part of the Coming Soon/Maintenance page so that visitors know exactly when to return your website.

Under the Timer Countdown tab:

  • In Enable: Turn the timer countdown on/off
  • In Title: Tailor the title of the countdown timer
  • In Title color: Support color picker to select the title color
  • In End Time: Decide when to stop the maintenance mode
  • In Disable maintenance mode after end time:
  • Yes: When the timer reaches end time, visitors can access to the site normally
  • No: Instead of turning off maintenance mode, visitors will still be redirected to the maintenance page and the timer will stop at 00:00:00
  • Clock Type: Select the type of countdown clock.

Maintenance page countdown timers

2.6 Metadata

Metadata of the coming soon page

Under Text Content tab:

  • In Page Title: Enter meta title of the customer page
  • In Page Description: Enter the Meta description for your maintenance page

Better for SEO juice.

2.7 Set up Newsletter, Social & Footer

Even your site is off; you can still get in touch with potential customers.

Newsletter settings

Under the Newsletter tab:

  • In Enable, choose Yes to enable the Newsletter subscription block; otherwise, choose No
  • In Title, tailor the title for newsletter box
  • In Title Color, enter or pick a color for the title

Social settings

Under the Social tab:

  • In Enable, choose Yes to enable the Social block; otherwise, choose No
  • In Title, tailor the title for the Social block
  • In Title Color, enter or pick a color for the title
  • In Facebook Link/Google+ Link/Twitter Link/Instagram Link/Pinterest Link, remove # and add your business social accounts.

In dropdown options of Footer, you can choose defined blocks or customized maintenance footer.

Moreover, you can create new blocks by going to Content => Blocks.

For example, here we choose Maintenance Page Footer.

Maintenance footer

2.8 Set up an alert email for admin

Alert for Admin

You should always be aware of the maintenance end time so that you can adjust the time if necessary. Under Alert for Admin tab:

  • In Email Sender, choose the sender of the alert email
  • In Email Receiver, enter one or multiple addresses to receive the alert
  • In Email Template, choose the template of the alert email
  • In Number of Days to Notify Admin in Advance, enter the number of days before the end time to send notification email automatically to the admin.

*Notes:

  • You must install SMTP to send alert to the admin
  • If you do not install Cron, please run the command php bin/magento cron:run –group=”default” instead
  • Add a logo to the email template for a professional display. Learn how here.

2.9 Preview the page

preview magento 2 maintenance page

Once you complete all settings, remember to Save Config.

Also, there will be a notification of Cache Management on the top of the page, please follow the link and flush the cache.

Click the Preview button to preview the coming soon/maintenance page.

2.10 Enable/Disable Maintenance Page via Command

To enable, please run php bin/magento maintenance:enable

To disable, please run php bin/magento maintenance:disable

Was this article helpful to you? Yes No

How can we help?