You can try adding this to your base.css file:
.products .product-col h3 {
letter-spacing: -.01em;
white-space: normal;
overflow: hidden;
text-overflow: ellipsis;
}
Result:
Hope that works for you!
@biznazz101
Topic summary
Issue: On a Shopify collection grid using the Porto theme, product titles are truncated after the first line. The requester wants titles to wrap so the full text is visible (example link provided).
Proposed fixes:
- Edit theme.liquid (via Edit Code) and insert additional code beneath the tag. The exact code isn’t visible in the post, but a screenshot is referenced for guidance.
- Add CSS in base.css targeting .products .product-col h3 with properties including letter-spacing, white-space: normal, overflow: hidden, and text-overflow: ellipsis. A screenshot of the result is provided, suggesting improved title display.
Notes: The second suggestion’s CSS aims to allow wrapping while controlling overflow; the provided screenshots are central to understanding the visual outcome. The specific code snippet for the theme.liquid edit is not present in the text.
Status: No confirmation from the original poster on whether either approach fully resolves the issue. The discussion remains open without a verified solution.