Shopify themes, liquid, logos, and UX
Hello,
I would like to remove the image thumbnail below my product image and only put a slider dots like the image attached and put some little arrow to go through the image . thank you for your help.
my website:
what I want:
my website is https://lachaise.co
password : Password25!
Solved! Go to the solution
This is an accepted solution.
Hi @GM15
You can try to add this code to check
.thumbnail-slider .thumbnail-list {
justify-content: center;
}
.thumbnail-slider .thumbnail-list__item.slider__slide {
width: 16px !important;
border-radius: 50%;
border: 1px solid #012694;
overflow: hidden;
}
.thumbnail-slider .thumbnail-list__item .thumbnail[aria-current] {
background: #012694;
}
.thumbnail-slider .thumbnail-list__item .thumbnail img { opacity: 0 !important; }
- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
This is Noah from PageFly - Shopify Page Builder App
Hi @GM15, this part belongs to the theme's settings. Can you check again in the theme settings in the Product information section to see if this change is included? Normally, some themes will allow users to change from showing list thumbnails to not showing list thumbnails
Best regards,
Noah | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
this is not possible on the dawn theme unfortunately.
Hello @Dan-From-Ryviu , you solved some of my issue before so thought you could know how to resolve that. thank you.
This is an accepted solution.
Hi @GM15
You can try to add this code to check
.thumbnail-slider .thumbnail-list {
justify-content: center;
}
.thumbnail-slider .thumbnail-list__item.slider__slide {
width: 16px !important;
border-radius: 50%;
border: 1px solid #012694;
overflow: hidden;
}
.thumbnail-slider .thumbnail-list__item .thumbnail[aria-current] {
background: #012694;
}
.thumbnail-slider .thumbnail-list__item .thumbnail img { opacity: 0 !important; }
- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
this is working, thanks a lot.
Do you also know how i could add arrow on left and right side of the image to slide through the image on desktop and mobile ? thanks
Where to Place this code? Thank you
You can try to add this code at the bottom of base.css file
- Helpful? Like and Accept solution! Or Support me: Buy Coffees
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024