How do I make my collection page look like this.. I would call it a card look.

How do I make my collection page look like this.. I would call it a card look.

lowrystore
Tourist
8 0 3

I was looking to make something similar to this.  How did they put the products on a "card" style and not the traditional grid look.

product collection cards.png

Replies 6 (6)

theycallmemakka
Shopify Partner
1661 396 416

Hi @lowrystore ,

 

The card-style layout you're referring to depends heavily on the theme you're using. Some themes come with built-in options for a card-style product display, while others may follow a more traditional grid layout. If your current theme doesn't support this feature, you may need to build it from scratch using custom code.

 

Could you let me know which theme you're currently using? That way, I can provide more specific guidance.

 

Thank you

 

Support Me: Buy me a Coffee


For quick response - Message Me


Ping me at: theycallmemakka@gmail.com

lowrystore
Tourist
8 0 3

I understand.  I am using the empire theme. Do you think it is built in?

 

theycallmemakka
Shopify Partner
1661 396 416

Hi @lowrystore 

 

The theme you are using "empire", does support the list view. 

 

You can update it from the collection section. Please go to the collection template and make the below chanegs.

theycallmemakka_0-1725507022051.png

 

 

Thank you

Support Me: Buy me a Coffee


For quick response - Message Me


Ping me at: theycallmemakka@gmail.com

KetanKumar
Shopify Partner
37043 3644 12027

@lowrystore 

Welcome to the Shopify community!
and Thanks for your Good question. 😊

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
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
lowrystore
Tourist
8 0 3

lowrymobility.com

See what you think about the card style product display.  Is that the correct terminology for this design style?  Is it called something different.  

I have see this style on electric sites like this: https://www.crutchfield.com/g_356350/Stereo-Receivers.html

and other sites like this : https://www.spinlife.com/mobility-scooters/travel-portable-scooters/critpath/match.cfm?categoryID=42...

 

 

KetanKumar
Shopify Partner
37043 3644 12027

@lowrystore thanks for share all details yes it possible to make more customization code liquid, html and css 

If helpful then please Like and Accept Solution.
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