Seperate Image with Text on mobile and desktop

[antoniamartina]

Hi, I am looking for a way to have two different Image with Text sections on the mobile and desktop version of my website. I've done the same with a slideshow by adding a custom CSS to two different slideshows. The custom CSS for the slideshow is:

@media (max-width: 749px) {
slideshow-component {
display: none !important;
}
}

But I don't know how to change the code to be applicable to the image with text section. 

[Sangeetanahar75]

hello @antoniamartina 

I can help you, please tell me the complete code of that section, I will fix it.

thanks

[Moeed]

Hey @antoniamartina 

Just simply create two sections, one for desktop and one for mobile and keep them published and once that's done then share your store url and password if enabled then I can provide you a code.

Best Regards,

Moeed

[antoniamartina]

Hi, the website is martinamaria.nl

I published both sections and have no password. My question is about the last two image + text section at the bottom of the homepage

[Moeed · Accepted solution]

Hey @antoniamartina 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
@media screen and (min-width: 768px) {
div#shopify-section-template--25194793894235__image_with_text_yCdQjk {
    display: none !important;
}
}
@media screen and (max-width: 767px) {
div#shopify-section-template--25194793894235__image_with_text_yydgJg {
    display: none !important;
}
}
</style>

NOTE: The first one will display for mobile and the second one will display for desktop.

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[antoniamartina]

I was actually hoping for a code to put in the custom CSS in the picture added. But this worked! So thank you very much!

[Moeed]

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.