Integrity (Crafty design) Change woocomerce single product mag glass icon

[gimmechefs]

Hi.

I found a thread where you can change this icon for ethos. But it is not working on my integrity stack with the crafty design template.

Could you help with the css for this?

The ethos code i found was

.woocommerce-product-gallery__trigger .emoji {
display: none !important;
}

.woocommerce-product-gallery__trigger {
font-family: “FontAwesome”;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
}

.woocommerce-product-gallery__trigger:before {
content: “\f002”;
}

Thanks
Max

[marc_a]

Hi @gimmechefs,

I checked your website under your subscription to determine your concern but I am not able to see your website because it is password protected, can you share your password so that I can able to check your website. Please put it on a Secure Note.

You can find the Secure Note button at the bottom of your posts.

Thank you.

[marc_a]

Hi @gimmechefs,

I revised the CSS code to fit exactly on your website, please go to Pro > Theme Options then CSS and this line of code below.

.woocommerce-product-gallery__trigger {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    width: 30px;
    height: 30px;
    font-size: 0;
}

.woocommerce-product-gallery__trigger:before {
    content: "\f002";
    font-size: 15px;
    top: 15px;
    position: absolute;
    left: 8px;
}

Here is an example of output from your website.

"Please note that providing custom code is outside the scope of our theme support. Issues that will arise from the use of custom codes should be forwarded to a 3rd party developer."

Thank you.

[gimmechefs]

@cramaton

.woocommerce-product-gallery__trigger {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    width: 30px;
    height: 30px;
    font-size: 0;
}

.woocommerce-product-gallery__trigger:before {
    content: "\f002";
    font-size: 15px;
    top: 15px;
    position: absolute;
    left: 8px;
}

That works perfectly Cramaton. Thank you so much.

[marc_a]

@gimmechefs,

It’s our pleasure to help you.

Thank you.