Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hello there,
I'm having an issue with product titles not appearing as two separate lines in collections on mobile.
Some product titles are being unnecessarily hyphenated, as you can see in the examples below.
Instead of simply being Swimming Trunks as one line then Orange underneath, it shows OR- ANGE as separate lines.
This looks very amateur and I'm trying to fix this asap.
Any help would be very much appreciated,
Thanks
Luke
Hello, Lukewalsh91, can you please share the url to your store?
Did you solve the issue? I am having the same problem...
hello, ChiaraG, can you share your url? He didn't, maybe seeing yours I can help
Hello, thank you! The url is this https://addvent.it/collections
and the problem is everywhere, not just on mobile. It's based on the classic Debut theme. I'm trying to fix the collection's titles hyphenation, that look bad
I'm not allowed to right click on the website or open the inspection tools, I can't find out anything like this...
@ChiaraG Ok, I was able to mess with it a little bit, by entering the page with the inspection tool already open. Anyway, go to online store > themes > '...' button > edit code.
Then, find a file like 'styles.css' or 'theme.css' or 'base.css', or anything with a name a bit more general like that. Then, at the end of this file, add this:
.collection-grid-item__title {
hyphens: none;
}
You literally saved my day! Thank you so much!!
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025