Shopify themes, liquid, logos, and UX
I'm using the craft theme, and on the desktop site, the collages are different sizes, as seen below:
I want them to be equal sizes, like how they are on the mobile site, as seen below:
How do I do this? I'm aware that I'll have to change some code, as now the only option to change it on desktop is "left large block" or "right large block".
My website is www.elementsofearth.ie
Hi @elementsofearth ,
You can follow the instruction below:
1. Go to Online Store->Theme->Edit code
2. Asset->/collage.css->paste below code at the bottom of the file:
@media (min-width: 750px){
.collage {
grid-template-columns: repeat(2,minmax(0,1fr)) !important;
}
.collage__item--right:nth-child(3n - 2) {
grid-column-start: 1 !important;
}
.collage__item--right:nth-child(3n-1):last-child {
grid-column-start: 2 !important;
}
}
If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.
Best regards.
Thanks so much for the reply. That worked perfectly for the first collage on my site, but it didn't apply to all of them, any idea why? Image below
Try setting the right image as the large one, worked for me
I'm trying to do the same, but the suggested code had no effect. My theme is unpublished, but that shouldn't matter, should it?
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024