Mkdocs-material: Nested 404 Fails to Load Bundled Resources

[seandstewart]

__I checked that...__

• [x] ... the documentation does not mention anything about my problem
• [x] ... the problem doesn't occur with the default MkDocs template
• [x] ... the problem is not in any of my customizations (CSS, JS, template)
• [x] ... there are no open or closed issues that are related to my problem

Description

404s on nested pages fail to load custom resources.

Expected behavior

404s should continue to render properly.

Actual behavior

See above

Steps to reproduce the bug

1. Here are live sites with the issue:
   
   
   
   • https://python-typical.org/usage/foo
   
   
   • https://bardly.org/plays/foo
   
   

Package versions

• Python: 3.8.1
• MkDocs: 1.1.2
• Material: 4.6.3 - 5.5.7

Project configuration

Bardly yml
Typical yml

System information

• OS: macOS
• Browser: Chrome, Firefox

[squidfunk]

Please provide your mkdocs.yml.

EDIT: Sorry, I've missed the links 😅

[seandstewart]

@squidfunk - I’ve linked directly to the two projects whose websites I referenced. Here they are again:

https://github.com/seandstewart/bardly/blob/master/mkdocs.yml

https://github.com/seandstewart/typical/blob/master/mkdocs.yml

Also - I did see another ticket referencing issues with 404 pages, but I have tested locally using the default them and mkdocs serve and the nested 404s rendered correctly.

[squidfunk]

The site_url must match the base directory of your documentation, so if it's hosted under /plays, the site_url must include that. This is a limitation of MkDocs, which is by design, as the 404 page includes _absolute_ links to all assets.

Demo:
https://squidfunk.github.io/mkdocs-material/oh/no/a/404

[seandstewart]

Sorry - I should have been more clear. Both of these sites are hosted at the root domain, and 404s work correctly directly from the root:

https://bardly.org/foo

But in nested directories it fails.

[squidfunk]

It is certainly related to your configuration. Material for MkDocs own documentation is hosted on GitHub pages in a subdirectories and 404s work just fine. As I said before, make sure that the site_url points to the subdirectory which hosts your projects root. You can check out Materials mkdocs.yml.

[Stanzilla]

I have the same issue, are you using Netlify to host your pages, @seandstewart?

Edit: Just checked, you do. SO, I think it's an issue on their end. Also reported here https://community.netlify.com/t/page-not-found-screen/21208/6

[seandstewart]

Interesting... I'm also noticing that all the static resources on the Netlify deployment have _relative_ URLs, but the local build all have _absolute_:

view-source:https://python-typical.org/usage/foo

As a sanity check, I ran a build with all post-processing and pre-rendering turned off, and blew out the cache as well, and it seems Netlify is still doing some post-processing of the HTML, based on the deploy log, which is in-turn re-writing the static URLs.

@squidfunk I'll go ahead and close out this ticket and jump on the train with the Netlify issue. Thanks for your patience and thank you for maintaining such an awesome project.

[braedon]

I ran into the same issue - relative URLs in 404.html - and I don't use Netlify. I think I found the issue, however.

If I look at the generated site/404.html after running mkdocs build, it includes relative URLs. If I view-source on a 404 page when using mkdocs serve, however, they are absolute.

I host my docs on the root of a subdomain, so my site_url didn't have a trailing slash - same as the examples reported here. If I change it to have a trailing slash, the URLs generated by mkdocs build are absolute, fixing the issue.