How to remove rounded corners from multicolumn images, Refresh Theme

Solved

How to remove rounded corners from multicolumn images, Refresh Theme

shopgrande
Visitor
2 0 1

I'm trying to remove the rounded corners from the top of the images and nothing is working, would love some help please.

website url is : macmercuri.com

 

issue.PNG

Accepted Solution (1)

suyash1
Shopify Partner
9576 1197 1537

This is an accepted solution.

@shopgrande - add this css to the very end of your base.css file and check

.multicolumn-card__image-wrapper {border-radius: 0 !important;}
Support me | To build shopify pages use pagefly | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.

View solution in original post

Replies 6 (6)

suyash1
Shopify Partner
9576 1197 1537

This is an accepted solution.

@shopgrande - add this css to the very end of your base.css file and check

.multicolumn-card__image-wrapper {border-radius: 0 !important;}
Support me | To build shopify pages use pagefly | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
WebcontriveApps
Visitor
2 0 0

There is already an option in the theme customization to manage the border radius. Please check the screenshot I attached.

WebcontriveApps
Visitor
2 0 0

You can go to the theme settings > Product cards > Corner Radius set to 0.

Please check the below screenshot for reference. 

Screenshot 2024-06-20 at 11.08.40 AM.png

Vinsinfo
Shopify Partner
352 125 118

@shopgrande Please follow below steps to remove rounded corners from multicolumn images. Let me know whether it is helpful for you.

 

1. From admin go to "Online Store" -> "Themes".
2. Click "Customize" button from the current theme.
3. Click "Multicolumn" and paste the below code in the "Custom CSS" field and save changes.

 

.multicolumn-card .multicolumn-card__image-wrapper {
    border-radius: unset !important;
}

 

Vinsinfo_2-1718863318406.png

 

Vinsinfo_1-1718863302889.png

 

Result will be like,
Vinsinfo_0-1718863295725.png

 

 
Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.
Please reach out to bizdev@vinsinfo.com for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

ZestardTech
Shopify Partner
5636 1031 1359

Hello There,

 

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

 

.multicolumn-card__image-wrapper {
border-radius: 0 !important;
}

 

ZestardTech_0-1718863669719.png

 

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

techlyser_web
Shopify Partner
1820 338 363

Hello @shopgrande 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
.multicolumn-card>.multicolumn-card__image-wrapper--full-width:not(.multicolumn-card-spacing) {
border-top-left-radius: unset !important;
border-top-right-radius: unset !important;
}
</style>

techlyser_web_0-1718863721014.png

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Techlyser || Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com