[Support request] Customize Homepage

[David]

Change the Element to a Loop Template ( not a Content Template ).

[russel]

Thank you.

Is there a way to move this template all the way to the sidebar and move the sidebar to the bottom?

Something like this:

[img]https://i.imgur.com/UmOOIsv.jpg[/img]

[David]

Change the Element Type to a Page Hero.
This will move it above the main content and sidebar.

[russel]

Thank you!

Would you be able to provide/modify an additional code to achieve this?

It’s almost identical to my request a while ago, but with added features.

THis is where the latest article would go

[img]https://i.imgur.com/V2UJDoJ.jpg[/img]

[Leo]

If that’s the Posts page then you can create a Block Element Content Template to replicate that style:
https://docs.generatepress.com/article/block-element-content-template/

[russel]

Unfortunately, it is a homepage and I think it requires some CSS.

I don’t know much about coding.

[Leo]

Your home page is indeed the blog page so the Content Template will work.

[russel]

I tried copying the code provided by one of your members, but I can’t seem to achieve the underline thing like in the image above

[David]

Switch the template to a Loop Template, and use this code to add a Query Loop that Inherit the Query from the current Template:

<!-- wp:generateblocks/container {"uniqueId":"9100bb57","backgroundColor":"var(\u002d\u002dcontrast)","isDynamic":true,"blockVersion":2} -->
<!-- wp:generateblocks/query-loop {"uniqueId":"cb7d751c","inheritQuery":true,"query":{"post_type":"post","per_page":10}} -->
<!-- wp:generateblocks/grid {"uniqueId":"19851f7a","columns":1,"verticalGap":40,"isDynamic":true,"blockVersion":2,"isQueryLoop":true,"lock":{"remove":true}} -->
<!-- wp:generateblocks/container {"uniqueId":"fbc19be8","isGrid":true,"isQueryLoopItem":true,"gridId":"19851f7a","width":100,"textColor":"var(\u002d\u002dbase-3)","isDynamic":true,"blockVersion":2,"lock":{"remove":true,"move":true}} -->
<!-- wp:generateblocks/grid {"uniqueId":"2a283538","columns":2,"isDynamic":true,"blockVersion":2} -->
<!-- wp:generateblocks/container {"uniqueId":"4f50e820","isGrid":true,"gridId":"2a283538","width":50,"widthMobile":100,"flexShrinkTablet":1,"flexBasisTablet":"300","isDynamic":true,"blockVersion":2} -->
<!-- wp:generateblocks/image {"uniqueId":"62553891","sizeSlug":"medium","widthMobile":"100%","objectFitMobile":"cover","useDynamicData":true,"dynamicContentType":"featured-image"} /-->
<!-- /wp:generateblocks/container -->

<!-- wp:generateblocks/container {"uniqueId":"a2c5e9f6","isGrid":true,"gridId":"2a283538","width":50,"widthMobile":100,"flexGrowTablet":1,"paddingTop":"0","paddingRight":"12","paddingBottom":"0","paddingLeft":"12","isDynamic":true,"blockVersion":2} -->
<!-- wp:generateblocks/headline {"uniqueId":"ae73526e","backgroundColor":"","textColor":"#f08a00","linkColor":"","linkColorHover":"","borderColor":"","marginBottom":"6","useDynamicData":true,"dynamicContentType":"post-title"} -->
<h2 class="gb-headline gb-headline-ae73526e gb-headline-text"></h2>
<!-- /wp:generateblocks/headline -->

<!-- wp:generateblocks/headline {"uniqueId":"01d28512","backgroundColor":"","textColor":"","linkColor":"","linkColorHover":"","fontSize":15,"useDynamicData":true,"dynamicContentType":"post-date"} -->
<h2 class="gb-headline gb-headline-01d28512 gb-headline-text"></h2>
<!-- /wp:generateblocks/headline -->

<!-- wp:generateblocks/button-container {"uniqueId":"ede2f440","isDynamic":true,"blockVersion":2} -->
<!-- wp:generateblocks/button {"uniqueId":"f54b7b94","hasUrl":false,"backgroundColor":"var(\u002d\u002dbase-3)","backgroundColorHover":"var(\u002d\u002dbase)","textColor":"var(\u002d\u002dcontrast)","textColorHover":"var(\u002d\u002dcontrast)","borderColor":"","borderColorHover":"","fontSize":12,"marginRight":"5","paddingTop":"4","paddingRight":"8","paddingBottom":"4","paddingLeft":"8","borderRadiusTopRight":"25","borderRadiusBottomRight":"25","borderRadiusBottomLeft":"25","borderRadiusTopLeft":"25","blockVersion":2,"useDynamicData":true,"dynamicContentType":"terms"} -->
<span class="gb-button gb-button-f54b7b94 gb-button-text">Button</span>
<!-- /wp:generateblocks/button -->
<!-- /wp:generateblocks/button-container -->
<!-- /wp:generateblocks/container -->
<!-- /wp:generateblocks/grid -->
<!-- /wp:generateblocks/container -->
<!-- /wp:generateblocks/grid -->
<!-- /wp:generateblocks/query-loop -->
<!-- /wp:generateblocks/container -->

NOTE: Have a look at how i built this one and the previous one, it will give you a handle on how tom create your own 🙂

[russel]

I’m trying. I’m getting the hang of it but I need a template to serve as a guideline.

anyway, How can I change the size of the container?

Not the width, but the actual size.

[russel]

Nevermind, it is in the padding .

[David]

Yeah it takes a little getting used to.
As an additional resource see here:

https://generateblocks.com/library/

Theres a filter to show patterns for Pro users and Free users.
And you can Copy and Paste them into your site.

Glad to be of help

[russel]

Already checked that but the elements that I want aren’t there – at least for a free user of GB.

I have encountered an issue:

1. navigation suddenly appears on the header right after I follow your guide on how to set the footer design
2. padding can’t move the container on the specified location (see image)

[img]https://i.imgur.com/72MqCAl.jpg[/img]

[David]

1. In Appearance > Menus, edit your current menu and change its Location to the Off Canvas Menu
1.1 Create a new Menu with NO menu items and set its location to Primary Nav.

2. Select the Image block and remove the left and right margins from it.

[russel]

2. Select the Image block and remove the left and right margins from it.

It only moved the image container.

Edit: oops, the results aren’t exactly the same when I check the live site. it works now

[Author]

Posts