How to create content layout in Homepage

Hi Paul,

You may use a GenerateBlocks Grid Block with 4 columns, then place 4 query Blocks, one for each column.

Here’s a short screen recording showing how to do as such: https://share.getcloudapp.com/nOuXP1Yb

Hope this helps!

hello

thanks for ur help

Q1: Why the last one border is beyond the background in mobile phone? https://prnt.sc/iPy3u6WRE4gC
Q2: how to change the homepage background color into white grey backgrond color ( let it be same with themebackground color grey) https://prnt.sc/tjpkqyp4nOvd

1. Try removing the margins you’ve added to the Container Blocks on all views, then just add appropriate Horizontal and Vertical Gaps on specific responsive views.

Example: https://share.getcloudapp.com/mXuxKjxJ

2. You can do so in Appearance > Customize > Colors > Body > Background.

Hope this helps!

hello

i already removed all margin value for 3 grid container, but he last one border is beyond the background in mobile phone https://prnt.sc/Vij4DvHZXYqV

Can you double check if the margin has been removed on mobile view for all Container Blocks as such?: https://share.getcloudapp.com/4gurlzE8

If it has, can you try clearing all caching mechanisms set in your website?

Kindly let us know how it goes.

hi,

thanks for ur again guide and now it's solved for the gap.

One more thing:

2. You can do so in Appearance > Customize > Colors > Body > Background.

If following the above,, the background color of the whole website will be changed into white.

Here, i just want to change the homepage background color into the white, and for the catergory page background color, also the background color of single post, both staty the same as before.

Pls guide and explain it here, thanks in advance

I see.

If you wish to make only the background color of the Homepage to white, here’s a CSS you may try adding through Appearance > Customize > Additional CSS:

body.home {
    background-color: #fff;
}

Hope this helps! Kindly let us know how it goes.

hi，

thanks for help and it is done for hompage color

one more thing, when we scroll down in homepage, why sticky navigation disappear? others are all ok .

I can’t seem to replicate the issue from my end. The sticky nav is working for both pages linked.

Can you try clearing your browser’s cache or try using a different browser?

hi,

thanks for your reply and help

one more thing

The content title will be shown automatically in each post category, for example https://prnt.sc/qRmtxV2J7SQ1

The same things are for the other cateogry.

My issue is : can i add the different background color or background image for the container of content title?

If so, how to do do that? pls guide and explain, thanks

You can create a Block Element - Page Hero.

Reference: https://docs.generatepress.com/article/block-element-page-hero/

If however, you’re referring to having different background colors per archive page, you might want to use custom CSS for that, but it's still doable through Block Element - Page Heroes.

Kindly let us know.

hi，
thank,

i hope to mainly use the theme tools to achive all effect, not use css code.

if really no any choice, only css, then it is no way.

I see. You would need to create multiple Block Elements(different versions) specific to each archive page if that’s the case.

If you’ll need further assistance, kindly let us know and we’ll be here to assist. :)