Change background color in list blocks

How do I change the background color for list blocks? Paragraph blocks have an easy color selection for background and text on the right side of the editor, but this functionality doesn’t appear when I select a list block.

thanks-

Hello there,

It looks like color options on list hasn’t yet been available in Gutenberg system. As an alternative, you could use a container block by Atomic Blocks – which allows custom background on it. Then you can insert a list inside it.

Regards,
Kharis

Was hoping there is a snippet of code that I could insert into the block to change the color. Does anyone know if this would work and what that could would be?

Hello there,

Try this code:

.entry-content ul {
  background-color: #fff000;
}

Add it to Appearance > Customize > Additional CSS from dashboard.

Regards,
Kharis

Thanks Kharis. Will putting this in the Additional CSS space on the dashboard apply the color change to all list blocks on the site? Is there a way to add code to the Additional CSS Class box for the block in the editor?

Hello there,

In the block options panel, under Advanced section, enter you custom class name

50

Then you can use this custom CSS code:

    .entry-content ul.my-list {
      background-color: #fff000;
    }

Regards,
Kharis

Made both those entries but it didn’t have any effect. Background in the block is still white.

Hello there,

Do you have a link to your page to share here, so I can inspect what is going wrong?

Regards,
Kharis

It’s in a dev environment, see if this link gets you there:

http://dev-bird-dog-logic.pantheonsite.io/dont-ruin-your-bird-dog/

the list block in question is the first list block in the post. The color should match the color of the image just below it (I left the image in there for comparison).

Hello there,

Thank you for sharing. Try this code:

    .list-blk {
      background-color: #b6b98e;
    }

Regards,
Kharis

That worked, thanks Kharis

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis