Next.js Discord

Discord Forum

different Layout

Unanswered
Flemish Giant posted this in #help-forum
Open in Discord
Flemish GiantOP
I want to have a different Layout for each page, because my pages have different background. how can I do it? Please

6 Replies

@Flemish Giant I want to have a different Layout for each page, because my pages have different background. how can I do it? Please
you could create the layout.tsx for each route
/app/layout.tsx <-- root layout
/app/(home)/layout.tsx <-- index page layout
/app/(home)/page.tsx <-- index page
/app/page1/layout.tsx <-- layout for page1
/app/page1/page.tsx <-- page1 page
Russian Blue
Also, layouts at a higher level are always inherited, so to avoid that make sure to group your routes taking into consideration the different layouts for each group
@Flemish Giant when I don't delete /app/Layout.tsx Part of the background color remains white. looks like i need to delete it too
the app/layout.tsx is required, it will auto create it for you if you don't have one
in your case, you should keep it as simple as possible
Flemish GiantOP
Okay thx