Visual image tags lost during minification

[alibey]

Hi Swifteans,

Client is concerned that the visual tags (ie Sale!, or Sold Out, etc) do not appear when the catalog is viewed on a mobile device or when the Swiftbuilder product mini element is used. The product mini is an essential alternative menu option for users to have an optimized (ie fast) view of her product catalog. You can see this when you click on the “Quicklook” submenu option on her site.

So for example, she has just sold in real life (ie her B&M) the Panda Eating Bamboo Shoots product, updated the catalog, but this update is not reflected when viewing the site on her Samsung Galaxy.

Is there a secret button hidden somewhere that I can click on to fix this?

Also, is it possible to change the circle to a square when viewing the mini products element. Client is concerned that customers will be confused and think all the catalog items are needlepoint “orns” (ornaments), which are round or oval needlepoint designs.

Thanks!

Ali

[David Martin – Support]

Hi,

1)

To add the badges for small screens, please use this CSS media query:

@media only screen and (max-width: 767px) {
.woocommerce span.onsale, .woocommerce .wc-new-badge, .woocommerce .out-of-stock-badge {
    display: block;
}
}

2)

Yes, you can adjust the CSS for the circle, to make it square you need to adjust the border-radius to 0:

.woocommerce span.onsale:after, .woocommerce .wc-new-badge:after, .woocommerce .out-of-stock-badge:after, .woocommerce .free-badge:after {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
}

Thanks.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

@media only screen and (max-width: 767px) {
.woocommerce span.onsale, .woocommerce .wc-new-badge, .woocommerce .out-of-stock-badge {
    display: block !important;
}
}

Thanks
Mohammad

[alibey]

please cancel/close topic – solved without help from swift support

[Mohammad – SUPPORT]

Hi,
Brilliant! Glad that your sorted it.
Thanks
Mohammad