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 😉
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!
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
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!