hi there,
I'm stuck with the home page styling on the payloadcms website template. How do we change the hero image and add some blocks below form the admin panel?
#Styling Home Page: Changing Hero Image & Adding Blocks
plush etherBOT
honest plank
candid delta
Hey @raven tree
You can follow these steps to modify the home page of the website template locally:
- Navigate to your admin ui—you can do this by going to
/admin(http://localhost:3000/admin) if you've not configured this to be something else
1.1 Login with your credentials - Click on your
'pages'collection - Click on the page in your list view
- Edit the page. To edit the blocks, you can navigate to the
'Content'tab iirc, and the blocks field should be first
If you mean, how do you add your own blocks and then render them on the frontend, then you should look around your website template directory. Your collections and their fields are defined in the collections folder, your blocks are also similarly defined. Rendering these on your frontend are straightforward, each has a slug and you can use this slug to create a js object mapping each slug to your frontend component.
raven tree
If you mean, how do you *add your own* blocks and then render them on the fronte...
there was no default page, I started to create mine. is that ok?
candid delta
Ahh, you didn't seed. Yeah that's perfectly fine
raven tree
if I seed I'm going to be able to populate the home page too?
candid delta
Yeah, it just "seeds" some predefined data in your db
You get a home page and a contact page, as well as 3 blog posts generated for you
And some images (3 iirc)
raven tree
well now that I haven;t done that I already have my posts etc.
raven tree
Yeah, it just "seeds" some predefined data in your db
Is there a way to style the homepage without seeding? I created a page, called it "home" published it, but nothing visible on the frontend
candid delta
You titled it 'home' but did it generate a slug for you? (Also just 'home')
Navigate to just your localhost root, you don't see the page there? What if you navigate to /home?
raven tree
Navigate to just your localhost root, you don't see the page there? What if you ...
no I don;t want to navigate to home. I want to modify directly the homepage i have and I wonder if there is an automatic way to do it.
If i navigato to home (the slug was only "h" idk why) I'm sure the page will be rendered, but when i land on my website i see the payload heading that invites me to customize the homepage from the admin panel.
candid delta
Oh, you installed the blank template, right?
It's kind of not clear what issue you're experiencing because the website template comes preconfigured for what you're asking already
You need to change the slug to 'home' because out of the box, the website template expects the homepage to have the 'home' slug
It's like a symbol
You can change this behavior, but you would need to add your own code in the (frontend) directory
Targeting the [slug] page