Shopify themes, liquid, logos, and UX
Hello
Using the Venture theme - I find it a bit ugly when the headings are wider than the product photo, see below. Also the headings can run into each other a little. Can I fix the line width to be the same as the image?
https://buckandhide.com/collections/lanyards
Next 🙂 Slightly trickier... When I have some headings on one line and some longer ones on two, it messes with the grid. I'd like all of the top lines of the descriptions to align horizontally, is that possible?
https://buckandhide.com/collections/snap-pouches
Thanks!
Jamie
Solved! Go to the solution
This is an accepted solution.
For the headings being wider you can add some padding. Add this to the bottom of your theme.scss.liquid file
@media only screen and (min-width: 750px) {
.product-card__name {
padding: 1.3em
}
}
This is an accepted solution.
For the headings being wider you can add some padding. Add this to the bottom of your theme.scss.liquid file
@media only screen and (min-width: 750px) {
.product-card__name {
padding: 1.3em
}
}
Perfect, thanks!
Aaah hold on! That also creates padding above the title which affects the crop on all the images. Can I just change the line width? Or can I manually add a line break into the titles..?
Try padding: 0 1.3em; instead
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024