the statamicist

your unofficial guide to the world of Statamic

Don’t Forget Your 404 Page

a tip from the statamicist · nov 29, 2012 · by fred leblanc

It is pretty easy to get caught up in the excitement of launching your new site, but did you remember to create your 404 page? This page-not-found page becomes especially important if you’re updating an existing design or converting your site from another cms into Statamic, as there are likely going to be places that didn’t transfer over one-to-one. You want to make sure users are greeted with a nice, helpful message that will get them to where they need to go.

Statamic comes with custom 404 pages built-in. By default, it will attempt to load the (or with the appropriate _content_type extension as set in settings.yaml) file from the root of your _content directory, placing your content into the default layout using the 404 template.

Let’s go through these one at a time.

The Page

Your page works the same as any other page on your site: you can set variables up top, and your content down below. You’ll probably want to set a title in your variables along with any other bits of information you’ll want to access in your 404 template. See fig. 1 as an example.

title: My 404 Page
We're sorry, but that page cannot be found. :(
fig. 1. A plain page.

The Layout

Statamic will use your default layout, unless you specify a different _layout value within the variables on your page. Here, just like any other page, you can specify whichever layout you’d like to use.

And The Template

Here is where things get slightly weird. By default, Statamic wants to use the 404 template. Why this, rather than the standard default template like all of the other pages? Because it seems that a lot of sites go out of their way to create interesting page-not-found pages, and defaulting to a separate template encourages that.

You have two options. First, you can create a fun, unique 404 page for your site. (Come on, it’s fun!) Otherwise, you can set the _template variable in your page variables to a different value (such as default) and pick which template you’d like to use.

title: My 404 Page
_layout: upside-down
_template: default
# Ain't No Sunshine When She's Gone

We're sorry, but that page cannot be found. :(
fig. 1. A not-as-standard page.

From There, You Build

Now that you know how to control all of the pieces, building out your 404 page is the same as building any other page. Once you upload everything to your server, type in a url on your site that you know doesn’t exist and see what it looks like.

If all went well, you should be looking at your brand new 404 page.

follow along