How to limit shop product title ?

gexingchen0916 · July 2023

Hello,

Pls is there any css code i can use to limit shop product title for woocommerce.

My shop page text title is too long.

I want it limited in two lines and ends of "..." , how can I do it ?

Thank you so much .

Please see pictures below

Phil · July 2023

Hi,

There is no option to control that, but check if the solution provided by another user would be helpful:

Best regards

gexingchen0916 · July 2023

thanks but the sulution is for descripition , I need for product title

Phil · July 2023

I came out with an idea that might work.

Please try the following CSS code:

.woocommerce ul.products li.product h4{
 overflow: hidden!important;
 text-overflow: ellipsis;
 height: 50px;
 white-space: nowrap;
}

Put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.

Best regards

gexingchen0916 · August 2023

thank you so much

gexingchen0916 · August 2023

Thank you , it works fine but seems limited 1 line , is it possible to limet it in 2 lines ? Thank you very much !

Phil · August 2023

Change the height value to e.g. 100px or higher. You need to check when two lines are visible.

Best regards

Comments