Two different 404 pages for a multisite

support
1

Hi It’s me again :slightly_smiling_face:
So I am creating a site in Hugo which is technically a multisite. Two in one.
Both sites have a similar layout but different menus and content.

The page structure is something like this

content/
├── pages/
│   ├── about/
│   │   └── _index.md
│   ├── about-rjis/
│   │   └── _index.md

layouts/
├── pages/
│   ├── about/
│   │   └── list.html
│   ├── about-rjis/
│   │   └── list.html

I separate the menu like this

{{ $current := . }}
  {{ if or (eq .Type "pages/home-rjis") (eq .Type "pages/social-services") (eq .Type "pages/cupping-therapy") (eq .Type "pages/hajj-umrah") (eq .Type "pages/hijama-cert") (eq .Type "pages/donations") (eq .Type "pages/islamic-centre") (eq .Type "pages/quran-online")  (eq .Type "pages/online-education")  (eq .Type "about-rjis") }}
    {{ range .Site.Menus.menurjis }}
      {{ partial "common/navlayout.html" . }}
    {{ end }}
  {{ else }}
    {{ range .Site.Menus.menulaser }}                  
      {{ partial "common/navlayout.html" . }}
    {{ end }}
{{ end }}

Now the issue I’m facing is I can’t figure out how to create separate 404 pages for them.

2

This is really a web server configuration question.

For example, in an Apache 2.4 configuration:

<Pages <your-website-root>/pages>
ErrorDocument /pages/404.html
</Directory>
<Directory <your-website-root>/pages-rjis>
ErrorDocument /pages-rjis/404.html
</Directory>

and in your Hugo project

content
|-- pages/
|   |-- 404.md
|   |-- about
|   |    |-- _index.md
|-- pages-rjis/
|   |-- 404.md
|   |-- about
|   |    |-- _index.md

And create 404-specific layout templates (e.g. layouts/404.html) and use layout in frontmatter.

---
…
layout: 404
…
---

Or, to avoid the need for layout in frontmatter, put the error pages in an error-pages-404 section and create and error-pages-404 template.

It really depends on how you are hosting and what layout your hosting provider will support (and whether your hosting provider supports using different 404 pages for different parts of the same site).

1 Like
3

I See, can you guide for netlify? I am going to host it on netlify, and github.

4

See their documentation at

5

I did see that but I am confused about it, on it they talk about multilingual sites, but in my case, the site is basically one. It just has a different nav for different page types. If you see the menu that I have shared. You know what I am doing it kinda work around.

6

Just ignore the fact it talks about multilingual. For the purposes of the redirect options what matters is that you have essentially two sites (one that is under /lang1 and another under /lang2), which is what you could have (only it is /site and /site-ijs).

If you want separate 404 pages, you likely have to restructure your site (I don’t think the 404 redirects have a regex or pattern option for choosing which pages to which to apply the 404: to quote from Netlify docs:

There are two limitations to be aware of when you use splats:

  • It’s not possible to use an asterisk as a wildcard in the middle of a path, for example /jobs/*.html. You can only use asterisks at the end of the path segment, such as /jobs/*.
  • It’s not possible to indicate a path to exclude from a splat redirect rule. Instead, we recommend that you take advantage of the rule processing order to set a more specific rule for the path that you want to exclude
1 Like
7

Hey @YasirRWebDesigner

Build the 404 pages for each language. The netlify or any other service is going to go up in the directory looking for the 404 page. For example if you have a 404 page in your blog directory and the error occur in that directory users will be shown the page blog/404.html if there is no such page the server is automatically going to move up in the directory.

content/
├── en/
│   ├── 404/
│      └── _index.md 
├── fr/
│   ├── 404/
│      └── _index.md #this page be shown when user in the directory fr/

Just make sure to be sure to be sure to not forgot to add url: 404.html in your front matter.

thanks

1 Like
8

okay so I created two 404.html files one of them in the root of main/404.html and other in rjis/404.html I also created a netlify.toml file and put this code in it.

[[redirects]]
from = "/main/*"
to = "/main/404.html"
status = 404

[[redirects]]
from = "/rjis/*"
to = "/rjis/404.html"
status = 404

but It’s not working, I see a blank page

image
image1366×768 85.2 KB

9

I created the files and I don’t get the url part but I added this to the frontmatter. Idk if it’s correct or not but It didn’t work.

----
title: '404 Page Not Found'
url:  'rjis/404.html'
----
10

update, when I add this to the netlify.toml. It starts working.

[[redirects]]
  from = "/*"
  to = "/main/404.html"
  status = 404

Does this has to do something with url? because rn my url look something like this /contact and /contact-rjis instead of /contact and /rjis/contact

11

changing the urls to / and /rjis/ aslo didn’t work, with this it’s still the same as above it only shows one 404 from the main dir.

12

Hi @YasirRWebDesigner

why are you creating redirects? netlify will handle it automatically, not just netlify but also when you run hugo server the 404 will work make sure you follow the given steps or share a demo repo to help you pin point the exact isssue

thanks

13

The netlfy.toml file will only work for 404 pages on a live Netlify site (with Netlify that means a deploy preview site or your production site) not with hugo serve.

14

the 404 pages work even on hugo server when setup as suggested above thanks