Solved

How can I alter the product info background color in the Prestige theme?

matthewalker
Excursionist
21 1 4

Hello,

 

Does anyone know how to change the background colour of the Product Info section of the product card? My theme is Prestige and there is nowhere to change any product card colour settings. Website is www.bestfurnitureonline.co.uk. First image is where I would like the colour to appear, and second image is an example of how I want it to look. The hex code I would like is #CFCBA4. 

InkedProduct Card.jpg

Product Card RL.png

  

Accepted Solution (1)

PageFly-Kate
Shopify Partner
1161 339 341

This is an accepted solution.

Hi @matthewalker ,

 

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code at the bottom of the file:

.ProductItem__Info,
.incubate-collections-add-to-cart-widget {
    background: #CFCBA4;
    padding: 5px !important;
}
.incubate-collections-add-to-cart-widget {
    padding-bottom: 15px !important;
}

I hope it would help you

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 3 (3)

PageFly-Kate
Shopify Partner
1161 339 341

This is an accepted solution.

Hi @matthewalker ,

 

This is Kate from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code at the bottom of the file:

.ProductItem__Info,
.incubate-collections-add-to-cart-widget {
    background: #CFCBA4;
    padding: 5px !important;
}
.incubate-collections-add-to-cart-widget {
    padding-bottom: 15px !important;
}

I hope it would help you

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

matthewalker
Excursionist
21 1 4

This worked, thanks! Do you know how to round the corners? Thanks!!

PageFly-Kate
Shopify Partner
1161 339 341

Hi @matthewalker ,

 

Sure, I’m happy to help you. Let’s try this solution:
You can  replace previous code by below code:

.ProductItem__Info {
    padding: 5px !important;
    background: #CFCBA4;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;

}
.incubate-collections-add-to-cart-widget {
    padding-bottom: 15px !important;
    background: #CFCBA4;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

 

I hope it would help you

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.