Maintenance mode for Statamic sites
We’ve done a few smaller projects with the relatively new flat-file CMS, Statamic. While it certainly has a few flaws and growing pains, it’s a promising system. I’m using it for this site.
One thing missing out of the box is the ability to put a site into “Offline mode”. ExpressionEngine, another CMS we have experience with, has this. It’s a nice little switch you can flip if you’re not wanting the public to see your site while in disarray during an update or something similar.
Here’s a relatively simple method we used recently to accomplish this. Basically, you’ll use a combination of environments (and environment variables) and redirects.
Set your dev and live environments your main settings.yaml
file
_environments:
dev:
- 'http://localhost*'
- 'http://example:2222*' // adjust to your local port
- '*.dev'
- 'http://dev.example.com*'
live:
- 'http://example.com*'
- 'http://www.example.com*'
In _config/environments/
, add a file for each environment you setup in the previous step (if they don’t already exist)
_config
environments
dev.yaml
live.yaml
Add a variable to each of these files, starting with dev.yaml
# Show the offline page template?
offline_mode: false
Same variable, different value for live.yaml
# Show the offline page template?
offline_mode: true
You now have a variable that can be used in your templates. So, let’s go ahead and use it in a simple redirect.
In your layout files (_themes/theme-name/layouts/default.html
), add a redirect
{ { if offline_mode && segment_1 != "offline" } }
{ { redirect url="/offline" } }
{ { endif } }
Remove extra spaces between curly braces
Create an “offline” or maintenance mode template in your _content
folder
Now you can deploy your site to the live server without worrying about things looking all busted. When you’re ready to flip the switch and make the site live, simply change the offline_mode
variable to false
in your live.yaml
environment file.
Bonus!
Use this same redirect concept to see the live site during the build out using the logged_in
global variable as the redirect if statement:
{ { if !logged_in && segment_1 != "offline" } }
{ { redirect url="/offline" } }
{ { endif } }
That will show guests the offline
template while signed in users (content creators, clients, and developers) can see real content.
Notice anything all busted with this? Let me know.