Button default color

Posted in: Newspaper
Post count: 89

Hello,

I am on the Gutenberg editor.
Every time I create a button block, I have to change the color settings for the button color and the font.
How to set these default colors for all the posts on the site?
Thanks for your help 😉

Post count: 35449

Hi,
The back ground color is set in css on this file path wp-content/themes/Newspaper/style.css at line 5091 -> https://i.imgur.com/Pli9Q52.png change the color from there and the default color for background button from the Gutenberg will change, or if you want you can set the code in the theme panel -> https://i.imgur.com/RW6CAE1.png the code
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not([class*="has-background"]) {
background-color: #4db2ec;
}

The rest of the css (fonts background color are in the same file) -> https://i.imgur.com/tGuhAXb.png
In case that you want to set it in the theme panel
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
transition: background-color 0.1s ease;
-webkit-transition: background-color 0.1s ease;
padding: 9px 12px;
font-size: 16px;
line-height: 20px;
font-family: 'Open Sans', 'Open Sans Regular', sans-serif;
font-weight: 600;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
background-color: #444 !important;
text-decoration: none !important;
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:not([class*="has-background"]) {
background-color: #4db2ec;
}

Thank you!

Post count: 89

Thank you it’s perfect 🙂

Post count: 32

Hi Calin,

Similar question: I have this button https://imgur.com/a/njlg9sS

What code would I write to auto center it, make it bigger and more rounded?

And where would I put the code?
Line 5091 of the code doesnt have the button styling https://imgur.com/a/zXgtfb7

Post count: 35449

Hi Bennettheyn, can you please provide a link where I can inspect that button? In this way, I can see from where the code is coming and what code should be used to set it bigger and center.
Thank you!

Post count: 32
Post count: 35449

Hi Bennettheyn,

Please try this custom css – https://i.imgur.com/NNxPG0l.png
.wp-block-buttons>.wp-block-button {
margin: 0 auto 8px;
}
.wp-block-buttons>.wp-block-button .wp-block-button__link{
border-radius: 10px;
padding: 16px 24px;
font-size: 18px;
line-height: 20px;
}

You need to set the code in the theme panel > Newsmag > custom code> css section.

I hope this will help you!

Post count: 32

Thank you! That was perfect

Viewing 8 posts - 1 through 8 (of 8 total)
The forum ‘Newspaper’ is closed to new topics and replies.