Next.js Discord

Discord Forum

How to apply different layout in child pages

Answered
Rhinelander posted this in #help-forum
Open in Discord
RhinelanderOP
I have /mypage/parent/child

in /mypage i have layout

but i don't want /child to recive that layout - i want it to have other layout

so i created new folder (childpage)/myparent/child and i made layout in /child

It just looks stupid to me to handle it in that way so any suggestions?

(I define same route twice)
Answered by ᴉuɐpɹɐɐ
your child can make a w-full h-full absolute inset-0 that covers the entire layout
View full answer

23 Replies

RhinelanderOP
RhinelanderOP
If i got to this link dashboard/clw4piuxu0003hs8javgalyx1/quiz Layout is diffrent than in this one dashboard/clw4piuxu0003hs8javgalyx1
yep looks good to me int erms of folder structure
make
/dashboard/(layout1)/[id]/quiz/layout.tsx
/dashboard/(layout2)/[id]/layout.tsx
these two will make 2 different layout
RhinelanderOP
It just seems weird to define twice
you can handle it in the client with useParam or usePathname if you want
depends on the layout
maybe there are other ways but idk how you 'd want your layout done
RhinelanderOP
I just want child not to have parents layout
Northern Flicker
yeah, that's it
I'm getting pain with same issue.
RhinelanderOP
Hahahha thanks
it is just weird
@Rhinelander I just want child not to have parents layout
your child can make a w-full h-full absolute inset-0 that covers the entire layout
Answer
Northern Flicker
As well, Is there any smart way to define a exact individual layout at a child page path?
As in, explicitly choosing which layout to choose in page.js?
Northern Flicker
Yes, I want to make page.js define its own layout to inherit.
@Northern Flicker Yes, I want to make page.js define its own layout to inherit.
Not possible without doing the discussed painful way (above).
you can always ignore using layout.js and just create your own <Layout> that you import at every page.js
thereby going to the pages routing paradigm haha
Northern Flicker
Got it. Let me dig it in