Shopify themes, liquid, logos, and UX
Hello, I've just upgraded to Dawn 6.0. www.ReelFishyApparel.com
I'm having an issue with Collection Images. I've uploaded square photos in my Admin > Products > Collections. The photos look great on my Home Page > Collection List (Shop All Products). However, when I click to go into the collection (ex: Jackets), the picture is not square. I have Show Collection Image checked and they suggest 16:9 (For best results, use an image with a 16:9 aspect ratio).
If I change the photos on my Admin > Products > Collections to 16:9, the picture is not correct on my Home Page.
If I uncheck the box - Show Collection Image, it doesn't show the image, but it also gets rid of all the collection images.
Is there a way to change to ratio on the collection image to square?
Thanks for any help!
Solved! Go to the solution
This is an accepted solution.
Hi @reelfishy
Here you go.
1. In your Admin store, click Online store > Themes
2. Go to the theme you want to edit, click Actions > Edit code
3. In your Asset folder, open the base.css and add the code below
.collection-hero__image-container.media.gradient {
aspect-ratio: 1;
}
Hello @reelfishy
I think we need to update some code from admin panel
If you don't mind, Can you please share me private access?
Hello, if you have a solution and let me know the steps and the code to add, I'd like to try it first on my draft version vs my live website. Thanks for any help!
This is an accepted solution.
Hi @reelfishy
Here you go.
1. In your Admin store, click Online store > Themes
2. Go to the theme you want to edit, click Actions > Edit code
3. In your Asset folder, open the base.css and add the code below
.collection-hero__image-container.media.gradient {
aspect-ratio: 1;
}
Thank you! Worked great!
Thank you for this fix.
Is there a way to fix it on mobile view?
This worked great for Desktop view, but it still shows 16:9 ratio on mobile view.
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