[Resolved] Button Spacing and Text Colour

[Will]

Hi,

How can I increase the space around these buttons? On this page for example.

Thank you very much!

[Ying]

Hi Will,

1. You can use the same code from your other topic, I just replied to you there.

2. Do you mean these buttons?
https://www.screencast.com/t/QAr2IDVJghg
If so, they seem added by a plugin, the style is defined by the plugin, unfortunately, GP has no control over it.

[Will]

1. Hi, I’ve seemed to add the code but the buttons are still close around the other headings and text.

2. No, not those buttons. The same button I’m talking about above. On this page, the text is blue

On others, it’s white. How do I fix this?

If I provide my login details below, can you please take a look?

Thanks

[Fernando]

Hi Will,

You can use a GenerateBlocks Button instead. With GB Buttons, you can add spacing and change its color easily.

Reference: https://docs.generateblocks.com/article/buttons-overview/

[Will]

1. Yes, but I’ve just migrated themes to GP. So I can’t go in and manually change each button. I know there is some code to sort this at scale.

2. This question about the colour hasn’t been answered.

[Fernando]

I see. You can try adding this CSS in Additional CSS:

div.wp-block-buttons .wp-block-button {
    margin-bottom: 20px;
}

As for the colors, try modifying the colors in Appearance > Colors > Buttons. Try checking the Block settings of the Button Blocks if you’ve set a color there as well.

[Will]

I can’t seem to get the CSS to work. Mind logging in and looking? And don’t really know anything about coding etc. I don’t want to break anything.

[Will]

And regarding the button, as they’re not GP ones it’s not controlled there. Its something to do with the link colour, but why is it being overridden in a button?

[Fernando]

I altered the CSS code, it should work now.

With regards to the colors, can you try disabling your optimization/caching plugins temporarily?

[Will]

Great, thanks for sorting the spacing!

I’ve de-activated WP rocket

[Fernando]

The other one is white, because it’s the “visited” color set.

The blue ones are the ones not visited.

Do you want it white all the time? You can try adding this CSS:

div.wp-block-buttons .wp-block-button a {
    color: #fff;
}

You may alter fff to your preferred color value.

[Author]

Posts