Shopify themes, liquid, logos, and UX
Hello guys, I want to make my slider images appear on mobile different than in desktop. How can I do that? Basically it's one image but it looks good on desktop but not on mobile.
sorry for any issue can you please share us store url
Hi @Ahmedo,
You need to create a Slideshow that displays only for mobile. Means add an option, it will help you to display either on desktop, or on mobile.
Go to file sections > slideshow.liquid and add code: https://i.imgur.com/Ka2om3o.png
Code: {{ section.settings.display }}
And add code here: https://i.imgur.com/sti2sPe.png
Code:
{
"type": "select",
"id": "display",
"label": "Display on",
"options": [
{
"value": "",
"label": "Desktop & Mobile"
},
{
"value": "medium-down--hide",
"label": "Desktop only"
},
{
"value": "large--hide",
"label": "Mobile only"
}
],
"default": ""
},
Then you can show it with customized option: https://i.imgur.com/y3mcFmM.png
Hope it clear to you.
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024