If you're updating your Blogger site and want to prevent visitors from seeing unfinished changes, this simple method shows a clean maintenance screen to everyone — while you can still access and edit your site as usual.
✅ What This Does
- Shows a maintenance message to visitors
- Keeps full access for admin (posts, layout, preview)
- Lets you bypass maintenance using a secret URL
- No redirect, no third-party script, SEO-safe
🛠 Step 1: Add Code Before <head>
Go to Theme > Edit HTML. Find <head> and paste this code right above it:
<b:with value='false' var='safeMode'>
<b:if cond='data:safeModeAccess or data:view.isPreview or data:view.isLayoutMode or !data:safeMode'>
🧱 Step 2: Add Maintenance Page After </body>
Scroll to the very bottom of your theme and paste this after </body>:
<b:else/>
<b:tag name='head'>
<title>Site Temporarily Offline</title>
<meta content='width=device-width,initial-scale=1' name='viewport'/>
<b:include data='blog' name='all-head-content'/>
<link href='//cdn.jsdelivr.net/npm/normalize.css@8.0.1/normalize.min.css' rel='stylesheet'/>
<style>
body {margin:0;padding:0;background:#f9f9f9;text-align:center;font-family:sans-serif;}
.offline-wrap {padding:80px 20px;}
.offline-wrap h1 {font-size:28px;color:#333;}
.offline-wrap p {color:#555;font-size:16px;}
</style>
</b:tag>
<b:tag name='body'>
<div class='offline-wrap'>
<h1>🛠 Maintenance Mode</h1>
<p>We're working on updates. Please check back later.</p>
</div>
</b:tag>
</b:if>
<!-- Enable preview access using a special key -->
<b:if cond='data:safeMode'>
<b:with value='"AccessNow"' var='safeModeAccess'>
<script>
//<![CDATA[
(() => {
const view = new URLSearchParams(location.search).get('view')
if (view === 'AccessNow') {
document.querySelectorAll('a').forEach(a => {
const u = new URL(a.href, location.origin)
u.searchParams.set('view', view)
a.href = u.toString()
});
}
})();
//]]>
</script>
</b:with>
</b:if>
</b:with>
🔁 Step 3: How to Enable or Disable Maintenance Mode
At the top line you added earlier:
<b:with value='false' var='safeMode'>Change false to true to turn maintenance mode ON:
<b:with value='true' var='safeMode'>Change it back to false to turn it OFF.
🔐 Optional Access URL (During Maintenance)
To view your blog normally while maintenance mode is active, open your blog like this:
https://yourblog.blogspot.com/?view=AccessNow✔ This lets you preview the full site even while others see the maintenance screen.
🎨 Customize the Look
You can edit the content inside this block:
<div class='offline-wrap'>
<h1>🛠 Maintenance Mode</h1>
<p>We're working on updates. Please check back later.</p>
</div>
Add your logo, social links, or any styling — but keep it clean to stay AdSense-safe.
✅ Done!
You now have a full maintenance mode system for Blogger with secret access, safe display, and no redirection — works great for redesigns or preparing for AdSense.