Quick shop button style

Hi Elise, how could i change the style for the circle button in the screenshot? (after making a few CSS changes, the square of the bottom of the button don´t come back to be transparent, even removing the changes, and now is white).

Attachments:

You must be logged in to view attached files.

Hello,

Please provide your site admin access, I will check.

Best Regards

Now is ok again, could you let me know the css code for the style of that button? and i will try to modify

Hello,

I need to see your site, cause the CSSS selector will depend on the style of the hover on the product.

Please provide your site URL. If your site is under maintenance also provide your admin access.

Best Regards

my site is down, is public

Hello,

Please try this code:

body.woodmart-buttons .woodmart-add-btn>a {
    overflow: visible;
}
body.woodmart-buttons .woodmart-add-btn>a:before {
    content: "\f11d";
    font-family: woodmart-font;
    font-size: 21px;
}

Modify it and add to the Theme Settings > Custom CSS

Best Regards

i used the code down, and won´t change anything

body.woodmart-buttons .woodmart-add-btn>a {
overflow: visible;
color: red;

}
body.woodmart-buttons .woodmart-add-btn>a:before {
content: “\f11d”;
font-family: woodmart-font;
font-size: 51px;
color: red;
}

Attachments:

You must be logged in to view attached files.

Hello,

Please provide your site admin access.

Best Regards

i attach the admin access

Hello,

Please specify the shape: round or square and the background: transparency or?

Best Regards

Transparency

Hello,

Please add this code to the Theme Settings > Custom CSS

.woodmart-hover-tiled .woodmart-buttons {
    background-color: transparent!important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}
div.woodmart-hover-tiled .woodmart-buttons > div a {
    width: 45px;
    background-color: #fff!important;
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1)!important;
    box-shadow: 1px 1px 1px rgba(0,0,0,.1)!important;
    border-radius: 50%;
}

Best Regards

I was confused, i thought that would be transparency-rounded like the original theme, could you let me know the code to make it ROUND?

Hello,

You have not added the cod it makes the button round http://prntscr.com/kyhk7d

As you can see the transparent background makes the button not visible enough if you still insist replace add this code:

.woodmart-hover-tiled .woodmart-buttons {
    background-color: transparent!important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}
div.woodmart-hover-tiled .woodmart-buttons > div a {
    width: 45px;
    background-color: transparent!important;
    -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1)!important;
    box-shadow: 1px 1px 1px rgba(0,0,0,.1)!important;
    border-radius: 50%;
}

Best Regards

Now is rounded, so is perfect, yes you are right is not very clear the button, i will do less transparent, thanks so much!

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts