Solved

hide a specific section on mobile view

discky
Shopify Partner
25 1 0

hi all, 

please check this screenshot https://prnt.sc/qbhlb1

URL is = https://shahniazstore.myshopify.com/

i am using turbo theme

i have a section which have 2 sub sections (text+images). i want to keep them both on desktop version but want to hide 1 sub section on mobile view so customer will not scroll a long and see products immediately. 

 

What i tried = i tried to hide the sub section on mobile view by modifying CSS and through media queries but got no luck. help will be highly appreciated. thanks

 

Accepted Solution (1)

oscprofessional
Shopify Partner
15830 2369 3072

This is an accepted solution.

Hello 

If you want to hide first sub section add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px){
#shopify-section-1576065013508 .container div:nth-child(1) {
    display: none;
}
}

If you want to hide second sub section add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px){
#shopify-section-1576065013508 .container div:nth-child(2) {
    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 4 (4)

oscprofessional
Shopify Partner
15830 2369 3072

Hello 

What you want to hide first sub section or second sub section?

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

oscprofessional
Shopify Partner
15830 2369 3072

This is an accepted solution.

Hello 

If you want to hide first sub section add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px){
#shopify-section-1576065013508 .container div:nth-child(1) {
    display: none;
}
}

If you want to hide second sub section add this css at bottom of
Online Store-> Themes -> Edit code->Assets->theme.scss.liquid

@media only screen and (max-width: 749px){
#shopify-section-1576065013508 .container div:nth-child(2) {
    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
discky
Shopify Partner
25 1 0

@oscprofessional  you ROCK..... thanks for the help

made4Uo
Shopify Partner
3804 713 1124

For anyone who want to hide a section but different from above's section, please follow the tutorial below. This should work on any section and any theme. No APP and it is FREE.

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!