Classe for primary buttons

Hello,

I am a using a shortcode and I need to apply the CSS the has been configured for the primary color of the theme buttons.

Would please give me the Class name that I can use?

Thank you
Regards

Hello,

Please provide the page URL where you want to change the button and its screen. I will inspect the element and give you custom CSS.

Best Regards

Hi,

below is the URL for the page as well as a screenshot of the button.

I need to show the button in red background and bigger size and when I hover it, it should turn on to black background.

Thank you
Regards

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body button.configure-product.configure-product-simple {
    background-color: yellow;
    color: red;
    margin-bottom: 10px;
}
body button.configure-product.configure-product-simple:hover {
    background-color: orange;
    color: red;
    margin-bottom: 10px;
}

Please set the colors as per your needs. The first snipped is for the default button state, the second is for the hover state.

Best Regards

Hello,

Thank you for your reply.

I am not sure that the default button of the theme will work since when I inspect the code of the button I have sent you above I see the class ” is-shortcode configure-product-simple configure-product configurateur”

However the one you gave me is different.

Thank you in advance
Regards

Hi

Seems to work

I have changed the CSS to this once

button.is-shortcode.configure-product-simple.configure-product.configurateur:hover {
background-color: black;
color: white;
margin-bottom: 20px;
}
button.is-shortcode.configure-product-simple.configure-product.configurateur {
background-color: red;
color: white;
margin-bottom: 20px;
font-size: 16px;
}

Hello,

Please consider the settings colors in the Theme Settings > Styles and colors > Buttons.

If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts