What is the best way to put some stuff into shared navbar only for / route
Unanswered
Egyptian Mau posted this in #help-forum
Egyptian MauOP
I would like to share a main navbar with all pages, but on the startpage, it needs a few more options than on subsequent pages.
How I would probably do it is to not include the navbar in the root layout at all, then have the folders (start) for the startpage and the layout with the stuff I need there, and (main) for all other pages with a layout that does not have the stuff that is only needed on the startpage.
Is this the way to go, or are there better options? For example, I've read about this recently, and it sounds like it could be useful for this case, but I'm not 100% sure how: https://nextjs.org/docs/app/getting-started/project-structure#parallel-and-intercepted-routes
How I would probably do it is to not include the navbar in the root layout at all, then have the folders (start) for the startpage and the layout with the stuff I need there, and (main) for all other pages with a layout that does not have the stuff that is only needed on the startpage.
Is this the way to go, or are there better options? For example, I've read about this recently, and it sounds like it could be useful for this case, but I'm not 100% sure how: https://nextjs.org/docs/app/getting-started/project-structure#parallel-and-intercepted-routes
5 Replies
Egyptian MauOP
I went with root layout not having navbar at all, then having
(startpage) and (other) folders with layouts that include different navbarsDoesn't feel great, but it works for now
That sounds like a good way to do it.
@Egyptian Mau you could also use auth, assuming your root layout isn't authenticated. You could check the session status and show and hide certain parts of the nav bar
@Egyptian Mau I would like to share a main navbar with all pages, but on the startpage, it needs a few more options than on subsequent pages.
How I would probably do it is to not include the navbar in the root layout at all, then have the folders (start) for the startpage and the layout with the stuff I need there, and (main) for all other pages with a layout that does not have the stuff that is only needed on the startpage.
Is this the way to go, or are there better options? For example, I've read about this recently, and it sounds like it could be useful for this case, but I'm not 100% sure how: https://nextjs.org/docs/app/getting-started/project-structure#parallel-and-intercepted-routes
parallel routes if the content of the navbar requires different async operation betweeb each subpage.
else, just do conditional rendering using
if you're concerned with SEO, usePathname() are SSR'd
else, just do conditional rendering using
usePathname()if you're concerned with SEO, usePathname() are SSR'd