How do I customize the 404 page for different urls?

This guide will go over how to show different 404 page content based on urls. In this example, we will have default 404 content and content that shows for any url containing /products.

  1. Add content that you would like to show for your default 404. Now, add content that you would like to show for any url containing /products.

  1. Select the content associated with /products and navigate to the data tab. Select + new binding in the element data bindings section and click “showIf” as the property and paste this for the binding:

state.location.pathname.includes('/products/')

  1. Next, select the default content and repeat the step above except select “hideIf” as the property and paste this for the binding:

state.location.pathname.includes('/products/')

  1. Now you can publish your 404 page and your customized content will show for any url containing /products.

1 Like