Changing my homepage product title lengths - Kingdom theme

Selvence
Excursionist
48 0 3

Hello,

Is there a way to reduce the number of title lines each product has on the homepage to 3 lines each? The titles are rather long. Thank you!

 

website: selvence.com

 

Selvence_0-1621598113844.png

 

 

0 Likes
HardikDavra
Shopify Partner
2423 375 1024

Hello, @Selvence 

Welcome to the shopify Community.

Please Go to Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid and paste this code at the end of this file.

@media screen and (max-width: 948px) {
.featured-collection__content .collection .product-item  .product-item__title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
}
For fast Communication: Email: parambabla.soft@gmail.com | Whatsapp
Selvence
Excursionist
48 0 3

Hello,

 

I added the provided code to my theme.css file but nothing happened

 

Selvence_0-1621619101164.png

 

0 Likes
HardikDavra
Shopify Partner
2423 375 1024

Please remove my old code and place this code.

.featured-collection__content .collection .product-item .product-item__title {
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
text-overflow:ellipsis
}
For fast Communication: Email: parambabla.soft@gmail.com | Whatsapp
Selvence
Excursionist
48 0 3

Getting there! I increased the line clamp to 3 just for my sake.

 

Additionally, I noticed that there are line remnants underneath the last line of each product title (whether I do 2 or 3 line clamps). You can see small pieces of black text that are unfinished. Any thoughts on how to eliminate that?

 

Selvence_0-1621784538387.png

 

0 Likes
HardikDavra
Shopify Partner
2423 375 1024
.featured-collection__content .collection .product-item .product-item__title {
margin-bottom: 0px;
padding-bottom: 0px;
}
For fast Communication: Email: parambabla.soft@gmail.com | Whatsapp
0 Likes
Lilith
Shopify Staff
Shopify Staff
538 68 145

Hi, @Selvence!

My name is Lilith, I'm on the Social Care team at Shopify. Thanks for providing a screenshot. To help you with this there is one basic and simple solution.

From your product images and titles, it does appear that you're dropshipping likely from Oberlo or AliExpress. One of the common mistakes that many new e-commerce merchants make is to not edit the product titles.

Product titles are a key area to sell the right words to the right people. The way that AliExpress names their products are intended only for most business owners to search and find their items based on keywords in their marketplace. However, when you sell to the general public you can't use the same method.

Using a string of keywords will be one of the major reasons why bounce rates may increase and your add-to-cart conversions will drop. Every part of your site should be thought out to appeal to your target customer.

As a rule of thumb keep your product titles to no more than 4 words maximum when dropshipping. Those words need to be clear to the point and simple. For example a simple Men's Faux Leather Strap Watch, Gold Skeleton Watch, or The Bradley Automatic Watch. Keep it simple and make sure that everything you name will be consistent. Consistency is important for your brand. Brand maintenance is essential for customer trust.

A similar idea is applied to product descriptions. The descriptions that have the manufacturer code and other unessential information for the customer should be avoided. What you can do is write up a short paragraph with about 3-4 sentences.

The product description is a great way to help optimize your SEO so your product page can be ranked on search engines. Aside from SEO, the description is your opportunity to sell the product, you don't have sales associates online helping the customer buy the product that fits their needs, so use the description as an opportunity to describe the product in a way that gives the customer the incentive to buy it.

To help you out with some basic dropshipping business steps and lessons we've got some fantastic free resources you can tap into!

Basically, to summarize, you don't need to reduce the lines in coding for the title's display on the site. Instead, the simple solution is to enhance your branding and customer trust.

Let me know how you do with the information above! I'm happy to answer any questions you think of as you work on your business.

Lilith | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
randyjikdo
New Member
3 0 0

i want this theme for my debut theme.please

0 Likes