Re: Adding a black border around collection grid products on the dawn theme

Solved

Adding a black border around collection grid products on the dawn theme

archivedept
Tourist
3 0 2

Hello, 

I am trying to add a solid black border around my products and move all of my products together as shown in the images. I also want to make the product images take up the whole page and not just the middle of the screen. If anyone could help I would appreciate it!

 

Theme: Dawn

 

https://archivedept.myshopify.com/

 

@KetanKumar 

@AvadaCommerce 

@Zworthkey 

@ZestardTech 

@JHKCreate 

Accepted Solution (1)
KetanKumar
Shopify Partner
37583 3668 12151

This is an accepted solution.

@archivedept 

thanks can you please try this code

1. Go to Online Store-> Theme->Edit code
2. Asset->/component-card.css ->paste below code at the bottom of the file.

.card__inner {border: 1px solid #000000 !important;}

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 7 (7)

KetanKumar
Shopify Partner
37583 3668 12151

@archivedept 

sorry for that issue how can i check this issue your store password protect 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
archivedept
Tourist
3 0 2

@KetanKumar  

ahprem is the pass sorry forget it was pass protected

KetanKumar
Shopify Partner
37583 3668 12151

This is an accepted solution.

@archivedept 

thanks can you please try this code

1. Go to Online Store-> Theme->Edit code
2. Asset->/component-card.css ->paste below code at the bottom of the file.

.card__inner {border: 1px solid #000000 !important;}

 

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
archivedept
Tourist
3 0 2

This solved the border issue. Thanks!

 

What is the best was to eliminate the inner white spaces on the grid to make the images appear seamless besides the border (I circled them in the image)

@KetanKumar 

Joshua_B
Tourist
4 0 1

Hello, I wanted to utilize this solution, but it seems that I do not have the component-card.css section under my assets. What should I do?

Rohan3
Visitor
2 0 1

How would you change the code so it only affect product cards and not collection cards?

 

 

KetanKumar
Shopify Partner
37583 3668 12151

@Rohan3  can you please share your store URL

If helpful then please Like and Accept Solution. Partnership of your ️ Coffee Tips and my code can bring miracles.
Want to modify or custom changes on store Hire Me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing