Help Center

Menu

Manage 404 Pages with Edge Side Includes (ESIs)

To effectively manage 404 pages through Edge Side Includes (ESIs), you can use a standard page with an esi:include directive pointing to your site’s main Page Not Found page.

Before you start

  • This tutorial assumes you have some knowledge about how ESIs work. The steps are designed for a site administrator or site developer.

  • Verify that ESIs are enabled for your Content Management instance. This setting is usually enabled by default in Squiz DXP SaaS instances.

  • Find your Page Not Found or 404 page in your Content Management instance.

Pre-requisite

Set the Send cacheable headers for 404 pages field to Yes on the System configuration screen .

  1. Click system configuration

  2. Click System configuration from the menu.

  3. In the HTTP headers settings section, slide the Send cacheable headers for 404 pages toggle switch to On.

  4. Click the Save button.

Your System administrator account must have appropriate permissions to change this setting.

Steps

Follow these general steps to create an ESI-driven Page Not Found (404) page:

Create the ESI proxy page

  1. Navigate to Design Nesters  Includes within your site’s administration panel.

  2. Create a standard page asset type named Proxy 404.

  3. Set the page to a blank or content-only paint layout and design. You still want the existing 404 page to control the presentation of the included content.

  4. On the Content screen, add an ESI include directive within the page structure.

    <esi:include src="./?a=XXXX" /> (1)
    1 Replace XXXX with the asset ID of your actual 404 page within the website.

    Depending how you

    1. create your 404 page; and

    2. include your <esi:includes /> script

    you may also need to append &SQ_ASSET_CONTENTS_RAW to the url.

  5. Click Save before continuing.

Point the 404 page to the ESI page

Now that you have configured your ESI page, you can point your existing 404 page to the ESI page.

  1. Locate your site’s Not Found Page in the asset tree.

  2. Change the setting for the site’s Not Found Page to now point towards the Proxy 404 page you’ve set up.

    This step redirects all 404 errors to your newly established ESI-configured page.

  3. Click Save before continuing.

Test the redirects

Now both assets are configured, you need to test that the redirects run correctly.

  1. Test out the new ESI redirects by thoroughly testing what happens when you attempt to navigate to pages not in your site structure:

    1. Does the first request to the 404-page cache the ESI properly?

    2. Do all subsequent requests to the 404 page correctly redirect and use the cached 404 page through the ESI?

  2. If testing passes, you can promote the pages to production.