collection page looks not nice can anyone help me??

DavidTelecom
Excursionist
15 0 4

Hi everyone 

my collection page looks not nice please help me with css 

i am using supply theme and this is my website  https://davidtelecom.nl/collections/iphone-11 

 

 

DavidTelecom_0-1614033602318.png

 

0 Likes
Pallavi
Shopify Expert
680 83 89

Hello There,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file


div#CollectionSection .grid .grid-item .grid-uniform {
display: flex;
flex-wrap: wrap;
}
div#CollectionSection .grid .grid-item .grid-uniform .grid-item a.product-grid-item {
margin-bottom: 0;
}

div#CollectionSection .grid .grid-item .grid-uniform .grid-item a.product-grid-item p {
min-height: 128px;
}

div#CollectionSection .grid .grid-item .grid-uniform .grid-item .product-item--price>div {
text-align: left !important;
}

div#CollectionSection .grid .grid-item .grid-uniform .grid-item .product-item--price>div form {
margin-bottom: 0px;
}

Screenshot :- https://prnt.sc/104gj72

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
0 Likes
DavidTelecom
Excursionist
15 0 4

Thanks a lot . 

You really help me if you tell me how to change  font make it small text and border like the below one. 

DavidTelecom_0-1614077683110.png

 

0 Likes
Pallavi
Shopify Expert
680 83 89


Hello There,

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss.liquid->paste bellow code in bottom of file

.product-item--price font {
font-size: 15px!important;
}
.product-item--price input.btn {
font-size: 15px!important;
}

.product-item--price a.btn {
font-size: 15px!important;
}

.product-item--price a.btn {
border-radius: 3px!important;
vertical-align: text-bottom!important;
border: 2px solid #0000a4!important;
}

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
0 Likes
DavidTelecom
Excursionist
15 0 4

Thanks again it works on collection page but in home page feautured collection not working 

could you help me also with that

 

DavidTelecom_0-1614083059843.png

 

please visit my home page

https://davidtelecom.nl/ 

0 Likes
Pallavi
Shopify Expert
680 83 89

Hello @DavidTelecom,

for home page I will need to check the code so if you can share your store access with then I can take a further look

You can share your store details with me on DM

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
0 Likes
DavidTelecom
Excursionist
15 0 4

i sent login information to your privet messenge 

 

thanks in advance 

DavidTelecom
Excursionist
15 0 4

Hi

did you login ?  

0 Likes