Shopify themes, liquid, logos, and UX
i have unnecessary space between products how can i remove it, and how can i make my banner clickable with individual link i have tried in the theme setting but it did not work, my site is www.aeshvi.com it is based on sense theme
please help
Solved! Go to the solution
This is an accepted solution.
Hi @aeshvi
You can add those code at the bottom of your base.css file in Online store > Themes > Edit code and add link for each button link of each slide to make your image banner clickable
.slideshow__text-wrapper {
padding: 0 !important;
max-width: 100% !important;
}
.slideshow__text {
height: 100% !important;
width: 100% !important;
opacity: 0;
max-width: 100% !important;
}
.banner__buttons .button {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
This is an accepted solution.
Please add this code to solve that issue
.slideshow__slide { overflow: hidden; }
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
This is an accepted solution.
Hi @aeshvi
You can add those code at the bottom of your base.css file in Online store > Themes > Edit code and add link for each button link of each slide to make your image banner clickable
.slideshow__text-wrapper {
padding: 0 !important;
max-width: 100% !important;
}
.slideshow__text {
height: 100% !important;
width: 100% !important;
opacity: 0;
max-width: 100% !important;
}
.banner__buttons .button {
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
}
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
Hi @aeshvi
The code above to make images clickable only, make sure you add code and add link to button link of slideshow
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
hi thank you soo much for taking your time and replying to me it really worked,
thank you again for being helpful
i am asking to much but if its possible can you solve the other thing too
Could you explain your other request so I can check and help you?
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
yes i have att ached two images u can see the difference, basically i want to remove unwanted space from the products so that can look more elegant
Please add this code at the bottom of your base.css file
.collection .card__inner { width: 100% !important; }
. collection .grid {
column-gap: 20px !important;
row-gap: 20px !important;
}
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
ok thank you i'll try it
You are very welcome, @aeshvi
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
hi sorry to disturb u again, but can check my site on desktop there is an issue when i vertically scroll in the slideshow it does not scroll but the slideshow image gets a little up
thank you in advance
This is an accepted solution.
Please add this code to solve that issue
.slideshow__slide { overflow: hidden; }
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
literally man you are a magician, i have searched the entire internet before but no one could help me with,
you are the best
Happy I could help.
- Helpful? Like and Accept a solution. - Donate: Buy coffee ☕- or Paypal me ❤️
- Ryviu - Product Reviews app, collect consumer photo reviews, import reviews from AliExpress, Amazon, Etsy, Shoppe and Walmart and CSV.
- Lookfy app: Create Image Lookbook, Photo Gallery with product hotspots
- Enjoy 3 months of Shopify for $1/month. Sign up now
User | RANK |
---|---|
227 | |
181 | |
63 | |
58 | |
47 |
On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023The year-end shopping season is just around the corner. Is a flash sale on your radar? Are...
By Jasonh Nov 6, 2023