How can I center products on Collection pages?

How can I center products on Collection pages?

GavinMB
Tourist
9 0 2

Centring products is possible with a standard adjustable setting in the Featured Collection block. However no such setting seems available in the generic Collection block. Please advise. Thank you.

Replies 2 (2)

PageFly-Victor
Shopify Partner
7865 1785 3094

Hi @GavinMB!

 

This is PageFly - Advanced Page Builder. I would love to give you some recommendation.

 

Please add this code at the 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%;
}

 

Best Regards;

Pagefly

 

 

 

 

GavinMB
Tourist
9 0 2

Hi Pagefly,

Many thanks for your swift suggestion. Unfortunately it has no effect; the products on the collection pages are still left justified. My preference is for centre justified.

Perhaps I’ve used the wrong file. As far as I can tell, Out of the Sandbox theme “Flex” does not have a theme.scss.liquid file. Instead, I tried adding your code to the styles.css.liquid file in the Assets folder. After that had no effect, I tried the same with the theme.liquid file in the Layout folder. Again, no effect.

In the end, I used the Featured Collection block instead of the Collection block. Oddly, the former has adjustable justification - left, centre or right - while the latter left justifies without option. What I hadn’t realised at the outset is that the Featured Collection permits a dynamic link to the collection that’s linked you to page in the first place.

Oddly, Out of the Sandbox - I approached them with this challenge -  didn’t think of the dynamic Featured Collection option. Instead they turned away my request, citing  code changes and their “policy” against such advice. They referred me to developers.

 

A bit concerning…

 

Thanks for taking the time and effort.

 

 

Best regards,

Gavin