Skip to main content

404 page

What is the 404 page section?​

Since v1.0.0

The 404 page section is what customers see when they open a link that does not exist in your store, for example an old product URL or a mistyped address. Use it to explain what happened and send customers somewhere useful, such as your home page or a best-selling collection.

404 page on desktop

Where to find it​

The section sits on the 404 page template. In the theme editor, open the page selector at the top of the screen and choose 404 page (in some stores it is listed under Others).

Section structure​

The section has no fixed blocks. Its content is built from theme blocks, and it starts with:

  • A Heading block, for example "Page not found".
  • A Text block with a short explanation.
  • A Button block that links back to your store.

You can add, reorder or remove any theme block, such as a Subheading, an Icon with text or a Separator. The content is always centered. See How sections and blocks work for how to add a block.

tip

Below the 404 page section you can add any other section, for example a featured collection, so customers who land on a broken link still see products.

Section settings​

Colors​

  • Text color: Set the text color for the whole section.
  • Background color: Set the background color of the section.
  • Background gradient: Set a background gradient. A gradient overrides the background color.

Section spacing​

  • Distance top (desktop): Space above the section on desktop (0 to 100 px).
  • Distance bottom (desktop): Space below the section on desktop (0 to 100 px).
  • Show custom mobile spacing: Enable this setting to use different spacing on mobile. When it is on, Distance top (mobile) and Distance bottom (mobile) appear.