Centering products in collection, boundless theme

Solved
Tourist
5 0 0

I am having trouble figuring out what code to change to center the products on the collection page. I have looked at a few forum posts but they all seem to be 2 years old and for different themes. Even when scanning my code for similar things talked about in solutions for other themes I can't seem to find the places that code needs to be changed. 

Help would be greatly appreciated as my site is going live next week.

0 Likes

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

.product-item.grid__item.small--one-half.medium--one-third.large-up--one-quarter {
padding-right: 20px;
padding-left: 20px;
}

Please share your site url so that i can check and give you exact solution.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
1 Like
Tourist
5 0 0

Thank you for the response, unfortunately, that didn't work.

https://kilianwilson.com/collections/frontpage password is geakra.

 

0 Likes

Hello 
You want like this:
43.jpg

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
1 Like
Tourist
5 0 0

Yes exactly like that. I have realized that on mobile it is like that but I also want it that way for the web. 

0 Likes

Success.

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

.product-item.grid__item.small--one-half.medium--one-third.large-up--one-quarter {
    width: 50%;
}
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
1 Like
Tourist
5 0 0

Thank you, that worked. I really appreciate the help. One last thing if you don't mind, any way I can make those product images smaller? I'm not sure what size exactly but maybe 25% smaller.

0 Likes

Hello 

Add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

.product-item__image-container {
    width: 50%;
}

This will make product image smaller.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
1 Like