Shopify themes, liquid, logos, and UX
Hello good day
Im having an issue with the collection list page on the mobile version. Im using NARRATIVE theme.
In mobile version, in the collection list page I have the collections one by one and in a big size. I want to put 2 or 3 rows of collections to make the page smaller and easier for the customer, to not scroll all the time to see the collections. I tried some css codes but not worked. Could anyone help me please?
Thank you
Solved! Go to the solution
This is an accepted solution.
Please add the following code at the bottom of your assets/theme.scss.liquid file.
@media only screen and (max-width: 749px) {
.list-collections-template .grid__item {
float: left;
padding-left: 0px !important;
width: 100%;
}
.list-collections-template .card {
width: 50% !important ;
opacity: 0;
transition: all .5s ease-out;
-ms-transform: translateY(50px);
-webkit-transform: translateY(50px);
transform: translateY(50px);
display: inline-flex !important;
padding-left: 16px !important;
}
}
Please share store URL!
Thanks!
Here you can see the collections one by one. I need to put more rows or something!
thank you
This is an accepted solution.
Please add the following code at the bottom of your assets/theme.scss.liquid file.
@media only screen and (max-width: 749px) {
.list-collections-template .grid__item {
float: left;
padding-left: 0px !important;
width: 100%;
}
.list-collections-template .card {
width: 50% !important ;
opacity: 0;
transition: all .5s ease-out;
-ms-transform: translateY(50px);
-webkit-transform: translateY(50px);
transform: translateY(50px);
display: inline-flex !important;
padding-left: 16px !important;
}
}
Sorry not worked that code, the whole page is now empty all in white, no images and collections now
Please check screenshot
Now is working, i changed the opacity to 100% and its perfect
Thank you legend!
Maybe could you help with other thing? I opened a conversation but not solution yet..
I want to change the number of rows of the product submedia gllery. Actually I have two or three rows and i want to put all the submedia gallery images in one row. Could be possible?
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