How can I limit the length of the product name on the collection page?

Solved
Highlighted
Tourist
6 0 2

Hi,

I am using Supply theme. Can anyone advise how I can limit the length of the product name so that the 'Add to cart' button can be align on the same level? 

Please help.

KK

 

 

 

productname.jpg

Highlighted

Give me your page URL, so I can give you a custom code to fix.

CRO Expert at PageFly - Advanced Shopify Page Builder.
- PageFly Page Builder: Website | Facebook | LinkedIn | Group | Youtube
- [Tutorial] Get
more tips on using PageFly to soar sales this season
- [Master Guides]: Get Your Shopify Store Ready for Black Friday
0 Likes
Highlighted
Shopify Expert
3900 559 936

This is an accepted solution.

Hi @KKWAN 

Open snippet->product-grid-item.liquid and fine {{ product.title }}

now change this code with below:

{{ product.title  | truncate: 30}}

Note: you can change 30 with any number that mean they show 30 character of title.

 

Want to modify or custom changes on store hire me.
Want to give Gift for time? its my Paypal too.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Highlighted
Tourist
6 0 2

Thanks for your help.

0 Likes
Highlighted
Tourist
11 0 0

Hi Jasoliya

Please help us to solve the product title issue on the collection page here is a screenshot https://www.screencast.com/t/TfybUg5C82G

here is the website collection page https://ihighlands.myshopify.com/collections/african-blackwood-bagpipes

0 Likes
Highlighted
Shopify Expert
3900 559 936

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

@media only screen and (min-width: 767px) {
   .product-grid .product .name{    max-width: 265px;} 
}
@media only screen and (max-width: 767px) {
   .product-grid .product .name{    max-width: 165px;} 
}
Want to modify or custom changes on store hire me.
Want to give Gift for time? its my Paypal too.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Highlighted
Tourist
11 0 0

Thank you so much for your quick reply. But there is no theme.scss file under ASSETS

0 Likes
Highlighted
Shopify Expert
3900 559 936

Then you can add in any cs file you have.

Want to modify or custom changes on store hire me.
Want to give Gift for time? its my Paypal too.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
Highlighted
Tourist
11 0 0

Yes, it's work. You are super

 

Many thanks.

 

Everything1_0-1604648548014.png

 

0 Likes
Highlighted
Tourist
11 0 0

Hi Jasoliya

We are facing issue with mega menu

Sometime mega menu show like this 

Everything1_0-1604906883580.png

 

and sometime show correct with space

 

Everything1_1-1604906909719.png

 

here is url https://ihighlands.myshopify.com/

CAN YOU PLEASE HELP US TO SOLVE ISSUE?

Thank you

0 Likes