Shopify themes, liquid, logos, and UX
I want all my product images and text to be lined up and uniform throughout the website. Right now it looks fine on desktop, but it is messed up on mobile. How can I fix this?
My website - Bakegomo.com
Hello @GlitchGator, Can you highlights your bugs?
@Wahab_Ahmad I'm not sure what you mean, but I'd to line up product images and titles even when they are differing in size. I've posted a pic of how it is on my website for mobile currently.
Thanks for clear your bug
can you please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
This code change after 5-6 second
@media only screen and (max-width: 749px) {
.grid-view-item__image-wrapper div {
padding-top: 100% !important;
}
.grid-view-item__image {
height: 100%;
object-fit: contain;
}
}
Afte code this view
Awesome! That worked perfectly.
If I would also want things to be lined up automatically on the desktop, is there anything else I would need to add?
Or would this piece of code be sufficient?
Thanks!
it's my pleasure to help us
nothing any change its fine fo your code
Hi
I tried to do the same thing in my store but it didn't work! could you help me to solve it ?
Hello,
I followed your instruction but it didn't work.
Can you help me to solve this problem?
Thank You.
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
Hello,
Thank you for your help.
Please find below my website.
Thank You.
thanks for it which page do you have facing this issue please share particular page url.
Please find the below URL for the issue.
https://www.ummamarkets.com/collections/snack-chips
Thank You
great, Thanks please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.css ->paste below code at the bottom of the file.
this code apply for after 5 - 6 second
.grid-view-item__image-wrapper div {
padding-top: 100% !important;
}
.grid-view-item__image-wrapper .grid-view-item__image {
height: 100%;
object-fit: contain;
}
Thank you so much~~~!!!!!
it's my pleasure to help us
hi I've tried the code it didn't work is there another solution?
many thanks
tracey
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
Thank you for getting back to me 🙂
https://waxaholic-shop.myshopify.com/
Also under the shop heading i have different pages but all my products seem to be duplicated across all the pages rather than just under wax melts how do i add products separately to the other pages (christmas advent calendar, wax burners?)
many thanks for your help
thanks but your store is password protect
hello @waxaholic
your store is password protected then also provide a password So I will check and provide a solution here.
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