Maintenance Mode Page Editor
Design the page customers see while your store is offline for maintenance, and take your store offline and back online cleanly.
If you ever need to take your storefront offline — for a big catalogue update, a replatform, or scheduled downtime — BillionBiz shows visitors a designed maintenance page instead of a broken site, and brings them straight back once you switch the store back on.
There are two related screens: Settings → Maintenance is where you take the store offline and back online; Online Store → Pages → Maintenance page is where you design what visitors see while it's offline. The design screen opens the same page-picker editor used across BillionBiz's Pages Program screens — the same one you'd reach for About Us, Cart, Checkout, and every other page type via Landing Page ▾ → Every page of your store in the main Landing Page Editor's command bar (see Switching between your store's pages). Maintenance sits in that switcher's Home group, alongside your homepage.
What you can do
- Design the maintenance page from 42 ready-made templates, from classic corporate looks to cinematic sci-fi and retro designs.
- Edit the heading and message text, and — on templates that support it — a countdown timer, a status board, or an email notify-me form.
- Take your store offline and back online with a single switch, with an optional scheduled start and end time.
- Let visitors leave their email to be notified when you're back, and export the list afterwards.
- Let your own team bypass maintenance mode with a private link, so you can keep testing while customers see the maintenance page.
Designing the maintenance page
Screen: Online Store → Pages → Maintenance page.
This screen is a left sidebar of controls next to a live preview — not a section canvas like the regular Landing Page Editor. The sidebar has two tabs, Design and Config.
Choose a template (Design tab)
The Design tab opens on a Template grid spanning 42 designs — 18 classic looks (Enterprise Professional, Tech & Innovation, Luxury & Premium, Modern Minimal, Scheduled Maintenance, Emergency Outage, Coming Soon) plus 24 newer premium designs, including several cinematic or thematic ones (a retro synthwave city, a terminal/console readout, a newsroom bulletin, a mission-control console, a festive countdown). Most of the newer designs are flagship templates — locked with an Upgrade badge until your store is on any paid plan (Starter, Growth, Pro, or Max, not just Pro or above). Upgrade from Billing → Plans & Billing (see Plans & Billing); if a template still shows locked right after you upgrade, reload the Admin Panel so the picker re-checks your plan. Click a Template / Theme jump chip at the top of the tab to scroll straight to that section instead of scrolling the whole sidebar by hand.
Fine-tune with a theme (still the Design tab)
Scroll (or jump) down to the Theme section, further down the same Design tab, to apply a colour and typography pack on top of your chosen template — Template and Theme sit one above the other as two sections of one tab now, not two separate tabs to click between. Maintenance pages have no Variant section — there's only one content arrangement per template, so that jump chip doesn't appear here.
Edit your content (Config tab)
Switch to the Config tab for a search box and a set of group cards — Content, Media, Features, Layout, Page Style, Advanced — click a card to slide into that group's fields. Write your heading and message under Content (for example, "We'll be back soon" and a short explanation of what's happening); swap the background photo under Media; and turn template-specific extras — a countdown timer, an email notify-me form, a status board, and similar — on or off as simple toggle rows under Features. Which toggles appear depends entirely on the template you picked in step one: a plain minimal template may have none, while a "mission control" or "emergency outage" style template has several.
Adjust page-wide styling (still the Config tab)
Page Style covers typography, spacing, motion, and global colour tokens for this page; Advanced exposes the underlying semantic colour tokens and any per-token overrides, for finer control than Page Style's presets.
Preview
The right-hand panel shows a live, pixel-accurate preview at desktop, tablet, or mobile width — with no store navigation, header, or footer, since a maintenance page is a standalone screen.
Publish
Click Save Draft to keep your work without going live, or Publish to push it. Publishing your design does not by itself take your store offline — that's a separate switch, covered below.
This screen used to look different
Earlier versions of this screen had three tabs — Templates, Themes, and Config — plus a
section-based canvas where clicking away from the content selected a separate Styles panel. That
build has been retired: the page now opens through the same two-tab (Design / Config)
picker every other Pages Program screen uses, described above. If you bookmarked the old
/maintenance-page-editor URL, it still works — it redirects here automatically.
Going offline and coming back
Screen: Settings → Maintenance.
The status switch at the top of this screen is what actually puts your storefront into maintenance mode. Turning it on immediately shows every visitor the maintenance page you designed; turning it off immediately restores normal storefront access — both take effect right away.
Once maintenance mode is on, you can also configure
- A scheduled start and end time, with an estimated-duration field, an optional countdown timer, and an optional progress bar on the visitor-facing page.
- A contact email and phone number, and whether to show your social links.
- An email capture form so visitors can leave their address and be notified when you're back — with a subscriber count and a CSV export once you're live again.
- An admin bypass link (a private token-based URL) so your own team can preview the real storefront while everyone else sees the maintenance page.
- An allow-list of IP addresses that skip the maintenance page entirely.
Tip
From the message field on this screen, click Open in Editor to jump straight to the maintenance page design screen described above.
The Maintenance Message block — full field reference
The templates above are one way to build a maintenance page. There's also a standalone Maintenance Message block in the regular Landing Page Editor's section library (Online Store → Pages → [your page] → + Add Section → Content) — the same heading/message/timer/badge building block, usable either as this dedicated offline page's content or dropped inline into any other page for a smaller "we're doing scheduled work" notice. Its Content tab has nine field groups:
Field groups on the Content tab
- Heading — Heading and Message text, plus the Show Countdown Timer toggle. Turning the toggle on reveals a Timer Target (ISO date) field; the countdown (and its Timer Style group, below) only render/appear once both the toggle is on and a target date is set.
- Appearance — Layout (Centered, Left-aligned, Split Left, Split Right) and Theme (Light, Dark, Business, Playful, Custom) selects, plus a Heading Font Size field.
- Background & Spacing — a Background Image picker, a Split Panel Image picker (only shown when Layout is Split Left/Split Right), and Padding (top/bottom/left/right, in units of 8px).
- Message Style — Message Color, Font Size, Font Weight (300–700), Text Alignment, and Line Height for the message paragraph specifically (separate from the Style tab's typography controls — see the callout below).
- Timer Style — only shown while Show Countdown Timer is on: Timer Text Color, Timer Chip Background, Font Size, and Chip Border Radius for the countdown digits.
- Badge — Badge Text, Style (Pill/Square/Minimal), Background Color, Text Color (the shared badge fragment used across the platform), plus two fields specific to this section: Badge Position (Top, Above Heading, Below Heading) and a Badge Icon emoji.
- Icon — Icon Type (None, Emoji, SVG, Image). Once set to anything but None: an Emoji/SVG Path/Image field depending on the type, an Icon Color (SVG only), an Icon Size (px), an Icon Position (Above Heading, Inline with Heading, Background Decoration), and an Animate Icon toggle (hidden for SVG icons).
- Decorative Elements — Show Background Pattern toggle (reveals a Pattern Type select — Dots, Grid, Waves, Circuit, None — and a Pattern Opacity slider), and a separate Show Heading Glow toggle (reveals a Glow Color picker) that adds a soft text-shadow glow behind the heading.
- Animation — Heading Animation (None, Fade In, Slide Up, Glow Pulse, Typing) always shown; Timer Animation (None, Pulse, Flip, Glow) only while Show Countdown Timer is on; Background Animation (None, Subtle Zoom, Gradient Shift, Particles) only once a Background Image is set.
- Progress Indicator — Show Progress Indicator toggle, then Type (Bar, Circle, Steps), a Progress percentage slider, a Label field, and a Bar Color picker.
- Social Links — a repeater of social links, each with Platform (Instagram/Twitter/X/TikTok/Email/Other), URL, and a Display Handle; rendered as a small icon row below the message.
Progress Indicator — the three shapes
Turn on Show Progress Indicator to reveal the Type dropdown, a Progress percentage slider (0–100), a Label field (e.g. "70% Complete"), and a Bar Color picker that fills all three shapes below. All three types share this same set of fields — there's no shape-specific configuration beyond the choice of Type.
| Type | What renders |
|---|---|
| Bar | A horizontal fill bar — your Label above it, filled to your percentage in your chosen Bar Color. |
| Circle | A circular SVG progress ring with your percentage as a number centered inside it, and your Label underneath. |
| Steps | A row of 5 pill-shaped segments. The number of filled segments is derived from your percentage in fixed 20%-per-segment steps (so, for example, 45% fills 2 of the 5 segments) — there's no separate field to set a custom step count. Your Label appears above the row. |
The Label and percentage text automatically follow the section's own Theme setting (Light, Dark, Business, Playful, Custom, from the Appearance group above) — you don't set text colour separately for the indicator.
Circle and Steps are live
Circle and Steps used to be selectable but not actually drawn on the storefront — the editor said so right in the Type dropdown. That gap has been closed: choosing either one now renders on your published page exactly like Bar does, just in the ring or segmented-pill shape instead of a bar.
A few other options are still labeled as coming soon
Outside of the Progress Indicator, a handful of other enum values in this block remain declared but not yet visually implemented, and the editor still tells you so right where you pick them: Heading Animation: Typing, Timer Animation: Glow, and Background Animation: Gradient Shift / Particles are each labeled "(coming soon)" in their own dropdown and currently have no visual effect once selected — the setting saves, but nothing changes on the storefront yet.
Message Style vs. the Style tab's typography controls
This block also has a Style tab (Section Background Color and, once a Background Image is set, a Background Overlay opacity slider) alongside its Content tab. Its Message Style group above is a separate typography control from anything on the Style tab — they write different fields, so setting one does not affect the other. Use the Content tab's Message Style group for the message paragraph's own font/color/alignment.