Butoon styling

Posted in: Newspaper
Post count: 53

Hi Team,

How can I change the styling of the buttons and other elements? Is it possible within the Theme Panel?

These are on Woocommerce Product Page.

https://ibb.co/SdTZ362

Post count: 27744

Hello,

So, if you have added the product page for Cloud Library, then you can edit it with tagDiv Composer -> https://i.imgur.com/yDk7PC9.png but if you add the products using WooCommerce shortcodes, then you need custom code CSS.

Thank you!

Post count: 53

Thanks. I wanted also to ask about button styling on standard posts. There is certain styling for buttons, also on hover. Where could I change that?

Post count: 27744

Hello,

Can you provide the link to your post? and the screenshots where you want to change the colour?

Thank you!

Post count: 53

Hi Anamaria,

Check here for example: https://jakaoferta.pl/najlepszy-abonament-ranking-abonamentow/

The button looks like this: https://ibb.co/J5HgW5B

I would like to change the color of the font and on hover + add radius there.

Post count: 27744

Hello,

I think you use a plugin, Kadence Blocks – Gutenberg Blocks for Page Builder Feature, right?
If yes, then you can change the color from these plugin settings for each block -> https://i.imgur.com/CHGpcjk.png

Thank you!

Post count: 53

Hi Anamaria,

I use Kadence, however this is another type of block, not a button. It does not have options to change colors.

I have already contacted Kadence support and they told me that this block sources information on colors from template’s default settings.

Post count: 27744

Hello,

Please let me know what block it is.

Thank you!

Post count: 53

The block is called “Posts”.

Post count: 27744

Hello,

I saw this block, take over the colors set for Single Post Content-> https://i.imgur.com/EJK7PiG.png, so to change the color I think you better use a custom css code -> https://i.imgur.com/VOaWloN.png
body .more-link-wrap a {
background-color: red;
color: #fff!important;
}
body .more-link-wrap a:hover {
background-color: blue!important;
color: #fff!important;
}

This code needs to be set in Theme Panel -> Custom Code -> Custom CSS.

Thank you!

Viewing 10 posts - 1 through 10 (of 10 total)
You must be logged in to reply to this topic.