Next.js Discord

Discord Forum

Different layout for not-found.tsx page

Havana posted this in #help-forum
Open in Discord
Hi! I am trying to make my not-found.tsx page have a different layout compared to the root layout that is being used in my Next.js 14 blog project. I have attempted to use group routes and divided my folder into (error) and (root). The root will contain the standard layout with my navbar and footer and the error will be the same layout without the navbar and footer.

I couldn't originally get the not-found.tsx page to render a different layout without this work around with the catch all folder [...not-found]. The catch all folder is currently just calling next/navigation's notFound(). This works great for any urls that are not defined, but the issue now is that for blog posts that don't exist I would like to have the same behavior by calling notFound(). However, calling notFound() renders the default next.js 404 page and not the one I specified in my (error) directory.

I am struggling to find a work around for this and would appreciate any help, thank you!

0 Replies