[Resolved] Change color of text within ONE block of text

[David]

You can use the free version of the GenerateBlocks plugin, then instead of adding a Text Block add a Headline Block, you will find all the settings you need in its sidebar:

https://docs.generateblocks.com/article/headline-overview/

Alternatively you can select your current Text Block, and go to Advance > Additional CSS Class(es) and give it a unique CSS Class eg. small-spacing

then add some CSS like so:

.small-spacing {
     margin-bottom: 20px;
}

[Trish]

Hey David,

I have the Simple CSS plugin installed already, and when I put that snippet of script in the Simple CSS textbox below that page, well… sadly it made no difference to reducing the large white spaces between the blocks of text.

And, yes I selected EACH Text Block, and went to Advance > Additional CSS Class(es) and typed in the unique CSS Class: small-spacing

See video linked below…

[Trish]

Is there a chance that I can get David’s assistance with this issue, please?

[Leo]

I’m not actually seeing David’s CSS being added in Simple CSS:
https://www.screencast.com/t/nSxtwnLi8

Can you add it in the Additional CSS field in the customizer?

[Trish]

The code IS in the proper place. See image below… you’ll need to scroll the image.

If I place that code in the Customize field, would it not effect the entire site rather than this one page?

[Leo]

I understand. But unfortunately I just don’t see it from the backend.

Do you mind trying my method first?

Make sure to clear any caching plugins or server cache you might be using.

[Trish]

I have cleared the cache several times HOPING that was the issue.

So, if I place that code in the Additional CSS field in the customize, would it not effect the entire site rather than this one page?

[Trish]

Okay… I’ve added the code to the Additional CSS field in Customize, clicked Published… cleared the cache… and no change. 🙁

[Leo]

It would only affect the text with small-spacing custom CSS class added.

[Trish]

Ah, right… I’ve added the code to the Additional CSS field in Customize, clicked Published… cleared the cache… and no change. 🙁

[Leo]

The CSS is indeed working:
https://www.screencast.com/t/RpoK8YHPEx

[Leo]

Make sure you are adding the custom class to the paragraph block and not the columns block.

[Trish]

The class small-spacing has been added to EACH paragraph block, yes.

[Leo]

Can you remove the small-spacing classes added to the columns?
https://www.screencast.com/t/3NA9cGZh

It’s adding extra spaces.

Make sure it’s only added to the paragraph blocks.

[Trish]

I couldn’t find how to select the top 3 column section, so I added the class to the columns. However, I have now deleted the class from all 3 columns.

It has made a minor difference to the spacing, but the spacing is still too far apart. Reduced the 20 to 5 px but the red paragraph is still to large a gap to the Revealed… paragraph block.

[Author]

Posts