Archived topic

tips please on styling a custom sidebar

3 replies · Started by William on April 15, 2022

Viewing posts 1–4 of 4

April 15, 2022 at 2:49 am #2189475

I am really enjoying moving over to generatepress (premium) and learning generate blocks - so thank you one and all.

I would like to style a custom sidebar to look the same as the standard sidebar. Any clues on which CSS to use please, or tips on generate blocks (am using container > grid > block structure for test of custom sidebar) would be very much appreciated.

Standard sidebar
https://w-f-m.com/about/
Test of custom sidebar
https://w-f-m.com/about/test-2/

Thanks in anticipation. :-)
William

April 15, 2022 at 4:42 am #2189560

Hi there,

thanks for the great feedback. So:

1. If you want to remove the list-style from the sidebar lists you will need to add this CSS:

.sidebar ul {
    margin-left: 0;
}
.sidebar ul li {
    list-style: none;
}

2. The Sidebar container padding, select the Parent GenerateBlocks Container Block add adjust its Padding. Whilst you have that block selected you can give it a Background color too.

3. The Headings, switch them to a GenerateBlocks Headline Block, which you can change to a H3 tag, and you have all the GB Styling cotrols for font size and spacing. You can add top margin go them if you want to put space between the different 'widget' areas.

Anything specific i missed ?

April 19, 2022 at 12:41 am #2193082

Hi David, It was kind of you to answer what is probably a rather basic CSS question rather than a proper "technical support" question. :-)

Many thanks for that. It is very much appreciated.

Kind regards,

William
P.S. I am planning to get more into CSS.

April 19, 2022 at 12:52 am #2193098

All questions are valid :) Happy to be of help!

This archived topic is closed to new replies.

Start building better websites today.