Product titles are an essential part of any online store, but sometimes they can be too long and take up too much space on the shop and archive page. Shortening product titles can help improve the user experience and make your store look more professional. Here are some ways to shorten product titles in WooCommerce:

Most of the guides suggest filtering the title using the_title filter hook which is a heavy way to achieve a simple feature such shortening the product title. The title can be shorten in a simpler way using only CSS Code.

Click on Appearance Menu -> Customize

Add this CSS code inside Additional CSS tab

.post-type-archive-product .woocommerce-loop-product__title {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: pre;
}

Using this three lines of CSS code is sufficient to limit the products title to one line making products items consistent in each row.

Posted in :