Solved

Need Help Hiding Section on Mobile

Vitadamore
Tourist
5 0 1

I have read through numerous posts on this but I can't seem to get it right.

 

I have created an Image with Text Overlay in my theme (Debut) that I want to show on desktop view. This image is too large for mobile view so I created a custom content image that works perfect on the mobile view.  The only issue is I don’t want the text overlay image to show on mobile view and then I don’t want the custom content image to show on the desktop view. 

Can someone please help me fix this!

 

Thank you!!

Accepted Solution (1)
oscprofessional
Shopify Partner
15830 2369 3071

This is an accepted solution.

Hello Vitadamore,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css.liquid

@media only screen and (min-width: 750px){
#shopify-section-1600576224664 {
    display: none;
}
}
@media only screen and (max-width: 749px){
#shopify-section-hero-1 {
    display: none;
}
}
Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing

View solution in original post

Replies 10 (10)

oscprofessional
Shopify Partner
15830 2369 3071

Hello Vitadamore,
Please share your site url.
So that i can check and let you know the exact solution here.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Vitadamore
Tourist
5 0 1

Thank you for your response @oscprofessional 

 

the website is https://vita-d-amore.myshopify.com

password: dockao 

the top image should be for the desktop view and then the bottom for mobile view. 

thank you! 

oscprofessional
Shopify Partner
15830 2369 3071

This is an accepted solution.

Hello Vitadamore,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css.liquid

@media only screen and (min-width: 750px){
#shopify-section-1600576224664 {
    display: none;
}
}
@media only screen and (max-width: 749px){
#shopify-section-hero-1 {
    display: none;
}
}
Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
Vitadamore
Tourist
5 0 1

@oscprofessional it worked!! Thank you!!

Ejejstanley
Visitor
1 0 2

Hi @oscprofessional! I've been reading forums and I've seen your responses on a few with this same issue. How are you finding the shopify section number to place in the css? I'm struggling with the same thing and would like to hide a section. Where should I look in the source code to find the section number so that I can modify the code myself? 

gkleind96
Visitor
2 0 2

Did you find that out? @Ejejstanley 

oscprofessional
Shopify Partner
15830 2369 3071

@Ejejstanley ,

Please share the issue which section you want to delete ? with screenshot and share the URL with password. 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
gkleind96
Visitor
2 0 2

Hello - how do i find out the correct section id - would be very helpful. thanks

oscprofessional
Shopify Partner
15830 2369 3071

@gkleind96 ,

Please share the issue which section you want to delete ? with screenshot and share the URL with password. 

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing

made4Uo
Shopify Partner
3804 713 1124

Hi everyone, 

 

Stop looking for section ID. Just look for first "<" bracket to the section you want to hide. Follow the tutorial below. It works on any section or any theme. 

Volunteering to assist you!  Likes and Accept as Solution  is highly appreciated.✌
Coffee fuels my dedication. If helpful, a small Coffee Tip would be greatly appreciated.
Need EXPERIENCED Shopify developer without breaking the bank?
Hire us at Made4Uo.com for quick replies.
Stay in control and maintain your security by avoiding unnecessary store access!