Adjust the shop page label color opacity to be 50%

Hi,

I want to change the shop page lable background white color to be 50% opacity, cause current full white color can cover product content on the thumb picture, please check how to implement.

Attachments:

You must be logged in to view attached files.

Hello,

Your issue has been resolved. Navigate to Theme Settings > Shop → Product Labels > Attribute Label Background.

To achieve 50% opacity, click on the color picker and set the alpha (opacity) to 0.5rgba(255, 255, 255, 0.5). Check back your site and check the issue.

Best Regards,

Hi,

Thanks for your help. One more question, can you check how to move the lable from the top-left to down-left, kindly check.
Appreciate!

Attachments:

You must be logged in to view attached files.

Hello,

Try to add the following CSS in Theme Settings > Custom CSS

/* MOVE PRODUCT LABELS TO BOTTOM-LEFT */
.product-grid-item .product-labels {
    top: auto;
    bottom: 7px;
    inset-inline-start: 7px;
}

Best Regards,

[Author]

Posts