Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
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!!