Custom 404 page handling

Support
1

Hi, I’ve been trying to handle the 404 error with a custom page for several days, but I’m not able to make it works.

The rooting of my webpage is the following:
/en/index.html
/en/404/404.html
/es/index.html
/es/404/404.html

I first tried with the file netlify.toml where the rules were:
[[redirects]]
from = “/*”
to = “/es”
status = 302
conditions = {Language = [“es”]}

[[redirects]]
from = “/*”
to = “/en”
status = 302

[[redirects]]
from = “/es/*”
to = “/es/404/404.html”
status = 404
conditions = {Language = [“es”]}

[[redirects]]
from = “/en/*”
to = “/en/404/404.html”
status = 404

It worked for redirecting lamguages but not for the 404 error. Now I tried with the file _redirects with the following rules:
/* /en 302
/* /es 302 Language=es
/en/* /en/404/404.html 404
/es/* /es/404/404.html 404

This option worked well for redirecting the language as netlify.toml did, but it didn’t work for the 404 error neither.

Does anybody know how to solve this problem?

Thank you!

2

Hey there,

Can you please share the URL of the site where you are trying to implement the custom 404, as well as your most recent deploy log? This will help us look into this further. Thanks!

3

Sure! The URL is: davidyareth.com

4

Thanks @DavidYareth, this helps! It does look like this is not working as intended, but we’re not sure why. I’m filing an escalation with our networking team to investigate further and we’ll let you know what we hear from them!

6

I appreciate it, thank you very much!

7

@amelia Has there been any progress? We have the same problem. Our __redirect file looks like this:

/   /es           302   Language=es
/*  /es/:splat    302   Language=es

/  /en            302
/* /en/:splat     302

/en/* /en/404.html 404
/es/* /es/404.html 404

This works fine for the language-based redirects, but the 404 pages dont work (eg. the default Netlify 404 page shows up). The custom 404 files are one the server as I can reach them if I navigate to them directly (example.com/es/404.html)

8

Oh, I think the issue is fixed by the order of the redirects. I have moved the 404 rules at the top of the redirect files and customized them a bit. Now everything seems to work as expected. I have also added more rules to catch 404 when there is no language path in the URL. This seems to catch all usecases:

# Custom 404 error pages
/en/* /en/404.html 404
/es/* /es/404.html 404

# Redirect all spanish visitors to the /es-pages.
/   /es           302   Language=es
/*  /es/:splat    302   Language=es
/*  /es/404.html  404   Language=es

# Fallback on all other pages to /en.
/  /en            302
/* /en/:splat     302
/* /en/404.html   404
1 Like
10

This solution also worked for me! Now I’m struggling with rooting to use custom css and js for my 404 page :frowning: , but the important error was fixed, thank tou very much :slight_smile: .