I LOVEEE YOUUU, I'VE BEEN TRYING TO DO THIS FOR 6 HOURS STRAIGHT AND FINALLY CAME ACROSS THIS MASTERIPICESDSADSADAS THANK YOUADASDSADSADSADSAD IM LOSING MY MIND
Andrew has the sweetest soul i have no idea who you are i stumbled across this episode never heard of you but i immediately connect with the kindness in you. Felt compelled to share
Works beautifully. Just a tip from my end as it wasn't working initially as I wasn't careful of the formatting. Don't forget get the space between }} and slider-mobile-gutter, and have all { positioned correctly in the cascading.
Amazing!! I don´t have experience in coding and was so afraid when following the steps (simple and really well explained) and then it actually worked wonderfully! I have been stuck with hiding sections for days. THANKS!!!!
Thanks ! It works if you follow carefully all the steps. ADVICE: duplicate your original slide.liquid file before making any change, then you change the newfile for the original, and keep this one with a old_sestion.liquid name
Wow, this is so good, and you're English is very easy to understand. This is a perfect example of what should be. Please keep up the amazing work; you are so encouraging!
Thank you so much, works perfect on mobile but on desktop the photo won't resize according to the screen. Is there anything we could do? Or can you suggest the size of the images we upload? Thank you!!!!
Hello. How do I make the mobile view section not appear on desktop view? so both views are active and desktop is not on mobile but mobile is on desktop. Thanks and please!
It works like this when changing size in browser but when I open the shop on actual mobile phone then the section is still shown. What can I do please?
Hi there, can you please help with the desktop view, it's showing both desktop and mobile slides? I've checked everything and it's still showing both on desktop only.
Hi, I need help with both slides showing on my desktop, the mobile view is perfect, it's just the desktop showing both. I've edited the theme a few times thinking I may have done something wrong but it's still not working. Can you please let me know how this can be fixed ASAP please. Thanks so much
Thank you so much! It work great in computer and cellphone. However, in tablets its not showing the mobile devices images. Can you help me to fix this, please?
Hey, thanks for the video it is really useful! Now as I have separated my Rich Text section in desktop and mobile version, I want to edit some codes but only for the mobile version. So, I want to change the font size of my Rich Text only for the mobile version. How do I do that?
Hey, i tried this and it is not working, any idea why? I already checked all the syntax and did the tutorial multiple times, can't seem to find what's wrong.
@@BNAFitnessTV No I never heard back or figured it out, but on the newest theme update they fixed the focal point so that helped a little with centering things for mobile
I dont write comment very often BUT i woud like to thank you veeery much!! the tutorial is easy, i understood everything what i was doing. really, thank you for your help!
Thank you very much for the clear explanation🙂 It is working, but it is one thing that is very strange. When using the setting "Mobile and tablet device", the section disapears in back end. I can see in the video (6:17) that this is not happening for you. Do you know how I can fix this? Thank you!
Hi. The main-product.liquid file is tied to your product, which also includes the product image slider. If you mean slideshow section, you have to customize the code to call the images related to your product. Be aware that this section might appear with the same information in all your products if not configured correctly
This worked super well...kinda! I have part of it working. I have a slideshow set to only show on desktop and another set to only be visible on mobile. The mobile does not show on desktop, but the desktop slideshow continues to show on mobile. Any ideas on how to fix?
@@made4uo I'm having this same issue, have you found a fix? I followed the tutorial for both the image banner and the slideshow, with the intention of having an image banner for desktop and a slideshow for mobile. Right now, what's happening is the image banner will show on desktop, but on mobile it shows both the image banner AND the slideshow instead of just the slideshow. Any ideas?
You have to add a custom code unfortunately. Another simple way with less coding is to duplicate your header section (file name depends on the theme you are using), then assign the header to desktop or mobile. To do this correctly, you need to hire a developer unfortunately
I am using dawn theme, i did all the steps multiple times and i am sure i did everything right, but my desktop slideshow is still showing on mobile while mobile is blocked on desktop. Did anyone have the same problem?
Probably too late to help, but yes! You'll want to 1) Move the liquid tag from your section container to your block container, 2) change the tag from {{ section.settings.show_on_device }} to {{ block.settings.show_on_device }}, and 3) move the schema setting from the "section" part of the JSON to the "block" part of the JSON. You may have missed step #2, I did at first!
I currently run into the issue that the images are not showing on mobile (button and text are visible). I checked all the settings in the video and i'm sure the code is exactly the same. Does anyone knows how to fix this?
Hello! I added this to the Image Banner on Dawn Theme and it works to hide the image, but I'm having an issue where the section is still displaying, just without the image so it's a huge blank space. Any thoughts on how to fix this?
@@made4uo I am doing this with a banner image so the first < says "div id" and I followed the instructions correctly and it is still showing both images on both a desktop and mobile view.
Make sure you have the very first HTML code and some sections might have to place the code on the section itself, which is handled by Shopify theme if you have Shopify 2.0 free themes.
I did this to banners and it works great, however the button alignment is always at the top now no matter where I tell it, I want the button to be bottom left though.. (for desktop, mobile is fine)
Great tutorial. Managed to add that option in most of the sections (but not in all of them). I'm using the FOCAL theme - couldn't find where to paste these codes in the "Gallery" and the "Shop the look" sections - would you be able to assist on that? I have 0 knowledge in coding - I'm just good at following good instructions. :) THANK YOU
@@made4uo thanks but i actually can't find where to add the 2ND code, the long one - the one that is supposed to come under the "settings" - can't find a setting under "class", only under "blocks" (in these specific sections)
Many thanks for the video. I didi everything and I even got the section that allows me to choose for mobile or desktop, but when i select the option I want, it still shows in the other device. Do you have any aidea of what can be happening? I´m using Dawn 9.0.0 theme.
Hello. How do I make the mobile view section not appear on desktop view? so both views are active and desktop is not on mobile but mobile is on desktop. Thanks and please!
I LOVEEE YOUUU, I'VE BEEN TRYING TO DO THIS FOR 6 HOURS STRAIGHT AND FINALLY CAME ACROSS THIS MASTERIPICESDSADSADAS THANK YOUADASDSADSADSADSAD IM LOSING MY MIND
Andrew has the sweetest soul i have no idea who you are i stumbled across this episode never heard of you but i immediately connect with the kindness in you. Felt compelled to share
Just wanted to show some love! thanks for this
This was a lifesaver - thank you!
I am always skeptical with these sorts of videos but this worked perfectly!
Thankyou a lot you are amazing!
Works beautifully. Just a tip from my end as it wasn't working initially as I wasn't careful of the formatting. Don't forget get the space between }} and slider-mobile-gutter, and have all { positioned correctly in the cascading.
Worked perfectly, great video. Clear, concise instructions and no issues on our end when performing for the Refresh theme. Huge thanks
Amazing!! I don´t have experience in coding and was so afraid when following the steps (simple and really well explained) and then it actually worked wonderfully! I have been stuck with hiding sections for days. THANKS!!!!
Best Guide and Best explaination! Give her a award i dont found anything usefull than this tutorial! Thanks!
Glad it helped!
Thanks ! It works if you follow carefully all the steps.
ADVICE: duplicate your original slide.liquid file before making any change, then you change the newfile for the original, and keep this one with a old_sestion.liquid name
Wow, this is so good, and you're English is very easy to understand. This is a perfect example of what should be. Please keep up the amazing work; you are so encouraging!
It worked perfectly. You rock
Many thanks!
Amazing! Works perfectly with Prestige theme. Thank you! ✨
You're welcome 😊
This was SO helpful. Thanks!
Thanks for the thorough explanation!
I was able to change it even I am not good at coding😊
Awesome!
Worked with spotlight, thank you so much, had so much trouble finding the right code
Subbed to the channel
Glad it helped!
YOU ARE AMAZING !!!
VERY CLEAR !!!
WORKED
SUPER THANKS
BTW just subscribed
That's great!!! Works like a charm! Thank you! ❤
You're welcome!
Thank you--this is just what I was looking for!
Worked like a charm - thank you so much!
this is a life saver!! worked perfectly! TYSM!!!
Thank you so much, works perfect on mobile but on desktop the photo won't resize according to the screen. Is there anything we could do? Or can you suggest the size of the images we upload? Thank you!!!!
Great video! Works like a charm!!!!
Perfect! simple, and straightforward - thanks so much!!
Amazing super helpful really appreciate this
Glad it was helpful!
Probably my third only comment ever on TH-cam but I just wanted to say thank you so much!
Thanks a lot! Perfectly explained, great solution!!!!!!!
Thanks so much, you helped me solve a problem I was stuck on.
Hello. How do I make the mobile view section not appear on desktop view? so both views are active and desktop is not on mobile but mobile is on desktop. Thanks and please!
Yes. This work with all themes. Link to instruction provided in the description
It works like this when changing size in browser but when I open the shop on actual mobile phone then the section is still shown. What can I do please?
HUGELY helpful!!!!!!!
Hi there! Just want to say thank you for a great tutorial. Appreciate it
Hi there, can you please help with the desktop view, it's showing both desktop and mobile slides? I've checked everything and it's still showing both on desktop only.
Hi, I need help with both slides showing on my desktop, the mobile view is perfect, it's just the desktop showing both.
I've edited the theme a few times thinking I may have done something wrong but it's still not working.
Can you please let me know how this can be fixed ASAP please.
Thanks so much
It works perfectly!!! Thank you :) Question: does the code work with the banner section? or just with the slideshow?
@marcososa1986 Hi. It should work on any section
Why is it saying schema error :(
Thank you so much! It work great in computer and cellphone. However, in tablets its not showing the mobile devices images. Can you help me to fix this, please?
Hey, thanks for the video it is really useful! Now as I have separated my Rich Text section in desktop and mobile version, I want to edit some codes but only for the mobile version. So, I want to change the font size of my Rich Text only for the mobile version. How do I do that?
@EkremBicici if you have richtext, you should be able to change to heading size or p using theme editor
Great Video. Thank you very much.
does this also work for Dawn 11.0 if so what is the code and how do I implement it? I can't find step in my code, setting seems nowhere.
having trouble remformatting the last step, shift tab and ctrl shift f, or ctrl alt f are all not working to reformat
Hey, i tried this and it is not working, any idea why? I already checked all the syntax and did the tutorial multiple times, can't seem to find what's wrong.
WOW!! It worked perfect! thanks!!
THANK you very much
Awesome! thanks Subscribed ♥
Thanks for the sub!
Everything works perfect, but when im doing the same thing with image banner, nothing is happening. Please help!
Great thanks alot!
Fantastic video, brilliant developer. Committed and extremely helpful. Thank you for taking the time to create the video and for all of your help.
Thank you
Thanks, may god bless you!
When I tried this the Slideshow arrow and dot navigation appeared on the top of the image, any way to get it back to the bottom?
Same problem here…when I ask their CS, they just told me to hire their expert to fix it. Do you have any idea how to fix it now?
@@valeung6641 Nah I couldn't figure it out, but I also have no idea what I'm doing when it comes to this kind of stuff...
I’m having the same problem did you figure it out?
@@BNAFitnessTV No I never heard back or figured it out, but on the newest theme update they fixed the focal point so that helped a little with centering things for mobile
THASNK YOUUUUU
I dont write comment very often BUT i woud like to thank you veeery much!! the tutorial is easy, i understood everything what i was doing. really, thank you for your help!
Thank you very much for the clear explanation🙂 It is working, but it is one thing that is very strange. When using the setting "Mobile and tablet device", the section disapears in back end. I can see in the video (6:17) that this is not happening for you. Do you know how I can fix this? Thank you!
Hi. The backend code should not disappear in your code. Please review the steps. You might have added it in the wrong place
When i'm adding your code to updated dawn theme file in slideshow section below arrow went on top when i choose desktop or mobile device option
Same problem here…when I ask their CS, they just told me to hire their expert to fix it. Do you have any idea how to fix it now?
Did you end up finding out how to fix this issue? I’m having the same problem
I am using this for the main product section. Is it possible to display different photos in the slideshow for different products/ product pages?
Hi. The main-product.liquid file is tied to your product, which also includes the product image slider. If you mean slideshow section, you have to customize the code to call the images related to your product. Be aware that this section might appear with the same information in all your products if not configured correctly
This worked super well...kinda! I have part of it working. I have a slideshow set to only show on desktop and another set to only be visible on mobile. The mobile does not show on desktop, but the desktop slideshow continues to show on mobile. Any ideas on how to fix?
Hard to tell without seeing your website
@@made4uo I'm having this same issue, have you found a fix? I followed the tutorial for both the image banner and the slideshow, with the intention of having an image banner for desktop and a slideshow for mobile. Right now, what's happening is the image banner will show on desktop, but on mobile it shows both the image banner AND the slideshow instead of just the slideshow. Any ideas?
@thesundaypostshop can you contact us using chat with us in our website? So we can check your theme code
do you have a solution if we want to have diffrent Menu on Dektop and Mobile?
You have to add a custom code unfortunately. Another simple way with less coding is to duplicate your header section (file name depends on the theme you are using), then assign the header to desktop or mobile. To do this correctly, you need to hire a developer unfortunately
it work in dawn theme .. just not add the css to base.css instead add it to theme.css remember to add it , ..hope it help
Just to clarify, I think you mean theme.liquid under the layout folder. If the base.css does not work for you, your file might be having some errors.
I am using dawn theme, i did all the steps multiple times and i am sure i did everything right, but my desktop slideshow is still showing on mobile while mobile is blocked on desktop.
Did anyone have the same problem?
it work in dawn theme .. just not add the css to base.css instead add it to theme.css ..hope it help
did you have like this one in video banner?
I found the pagination buttons move to the top of the slider instead of below it. Any one know how to solve it?
same problems... do someone has a solution please ?
@@xiRoMz did you find a solution for this? I’m having the same issue
Is it possible to make it work for blocks? When I add it to blocks, they don't hide.
Probably too late to help, but yes! You'll want to 1) Move the liquid tag from your section container to your block container, 2) change the tag from {{ section.settings.show_on_device }} to {{ block.settings.show_on_device }}, and 3) move the schema setting from the "section" part of the JSON to the "block" part of the JSON. You may have missed step #2, I did at first!
Code works great however, the slider controls have moved to the top instead of staying at the bottom of the slides. How do I fix this?
did you fix it?
@@theonlyestef i find a way, do you still wanna to fix it?
what if i would want to use this mode in Image Banner instead of slideshows>?
Actually, the example is for image banner
I currently run into the issue that the images are not showing on mobile (button and text are visible). I checked all the settings in the video and i'm sure the code is exactly the same. Does anyone knows how to fix this?
I'm having same issue 😢
Hiw do i fix this
Hello! I added this to the Image Banner on Dawn Theme and it works to hide the image, but I'm having an issue where the section is still displaying, just without the image so it's a huge blank space. Any thoughts on how to fix this?
I have the same issue but mine is showing both images. Let me know if you find a solution please!
Please make sure you place the code in the first < except if the next word is style or script
@@made4uo I am doing this with a banner image so the first < says "div id" and I followed the instructions correctly and it is still showing both images on both a desktop and mobile view.
@@SarahMaxey did you add the code in the class section?
@@made4uo Ah that is my mistake! Thank you for helping me with that - I really appreciate it!
amazing! thanks
it works...but both the slide sections showing on desktop and mobile???
Make sure you have the very first HTML code and some sections might have to place the code on the section itself, which is handled by Shopify theme if you have Shopify 2.0 free themes.
Can you explain this?@@made4uo
same issue
Did you solve that problem? I'm with the same issue. What did you do? I hope you can help me...
IT Worked, Thank you
On Mobile version the desktop slide is hidden
But on desktop version the mobile slide section is coming with out image, how i can hide that section
I did this to banners and it works great, however the button alignment is always at the top now no matter where I tell it, I want the button to be bottom left though.. (for desktop, mobile is fine)
There are some sections that this might not work since we have to provide the class to the section
this very basic, you just just display none and dispaly blok css property. any idea for mobile conditional logic?
Great tutorial.
Managed to add that option in most of the sections (but not in all of them).
I'm using the FOCAL theme - couldn't find where to paste these codes in the "Gallery" and the "Shop the look" sections - would you be able to assist on that?
I have 0 knowledge in coding - I'm just good at following good instructions. :) THANK YOU
Hi,
Just find the first
@@made4uo thanks but i actually can't find where to add the 2ND code, the long one - the one that is supposed to come under the "settings" - can't find a setting under "class", only under "blocks" (in these specific sections)
@@talbatit make sure this is a section, not a snippet or template. I'm not familiar with focal theme, I don't know how the codes are written
@@talbatit just add a code: settings: [ the schema here from video. Remove the last comma...] after the closing ], of blocks
@@made4uo UGH...sounds too complicated for me...got no knowledge in coding..I will probably mess up the code and ruin my store XD
it made al of my image banners smaller in height how do i fix this, please let me know
Hi. The code is just suppose to hide and show a section. It should not affect your css style. Please double check the placement of the codes
@@made4uo it changed the hight of my banners all over, i am almost sure the code is placed correctly
I have issue with the code in the blog
youre awesome thanks
Sorry, you do not currently have the necessary permissions to access this site, or this site may not be available in your region.
I love you. Thanks.
Greaaaaat😊
it doesnt work by me
me either :(
Many thanks for the video. I didi everything and I even got the section that allows me to choose for mobile or desktop, but when i select the option I want, it still shows in the other device. Do you have any aidea of what can be happening? I´m using Dawn 9.0.0 theme.
Hello. How do I make the mobile view section not appear on desktop view? so both views are active and desktop is not on mobile but mobile is on desktop. Thanks and please!