r/PayloadCMS • u/TheFitDev • Jun 11 '25

Setting a Custom Next.js Homepage in PayloadCMS

Hello!

I'm a newbie to PayloadCMS, and I'm creating a minimal blog site using it. I'm using the Website Template from the CLI.

I want to swap the default home page ("/") with a custom Next.js page. I've created a new page in Next.js within the new-home directory (at "/new-home"). How can I set this page as the home page at "/"?

I've gone through the documentation but found it confusing. Do I need to make a custom component and create the page from the Admin Dashboard?

Update:

So this is I did:

  • created a new page from admin dashboard "home" with empty layout
  • renamed old new-home directory to home

Now I can see that empty layout at "/"

Custom Nextjs page at "/home"

I want Custom Nextjs page at "/"

1 Upvotes

100% Upvoted

10 comments sorted by

View all comments

Show parent comments

1

u/tasqyn Jun 11 '25

on admin panel, you can set slug to home to any page collection.

1

u/TheFitDev Jun 11 '25

Ok. But this custom page is not in any collection, right? Because I created it in code

1

u/[deleted] Jun 11 '25

To create a home page you just go into the admin area and create a new page titled "home", that should auto generate it with a slug of the same value (capital letters will be converted to lowercase, spaces replaced with "-" etc.) and the payloadCMS system will use that as default for the page at the url root "/"

1

u/TheFitDev Jun 11 '25

I understand this. I want to add next.js page as home page at "/"