Shopify themes, liquid, logos, and UX
Can someone help me make my carousel for logos look like this sites "In the Press" section - https://dissh.com/
So smaller and all show on desktop, but then be carousel on mobile (and smaller).
Here is my site - https://myhaveli.com/
Hi @Nadine10,
You can follow these steps
1. Open Online Store > Theme > Edit Code
2. Find and open the base.css (or theme.css, custom.css) file
3. Paste the code snippet below at the bottom of the file and hit save
.flickity-slider {
transform: none !important;
gap: 15px !important;
overflow: scroll !important;
}
.flickity-slider .gallery__slide.carousel__slide {
position: static !important;
padding: 20px !important;
}
.flickity-slider .gallery__slide.carousel__slide .gallery__image {
min-width: 90px !important;
max-width: 120px !important;
margin: 0 auto !important;
}
/* Hide scrollbar for Chrome, Safari and Opera */
.flickity-slider::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.flickity-slider {
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
Here is the result
Hope this helps you solve the issue.
Please don't forget to Like and Mark it as an Accepted Solution if you find this helpful. Thank you!
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024