How to disable sidebar on mobile devices

  • Resolved jayceezay

    (@jayceezay)


    5 years, 8 months ago

    Hello. Are there any settings to disable the sidebar when the site is viewed on a mobile device? To phrase it another way, are there any settings for the sidebar (and all its widgets) to not show when the site is viewed on a mobile device? Thanks!

    • This topic was modified 5 years, 8 months ago by jayceezay.
    • This topic was modified 5 years, 8 months ago by jayceezay.
Viewing 3 replies - 1 through 3 (of 3 total)

  • I don’t see any options for disabling it in mobile devices but you could use some CSS to hide it based upon browser width in Appearance->Customize->Additional CSS

    @media (max-width: 768px) {
     .sidebar-main {
         display: none;
     }
 }
    Thread Starter jayceezay

    (@jayceezay)

    Thank you Jarret. This worked for me.

    Hi @jayceezay,

    Indeed, CSS provided by @jarretc will work fine. Though you can use ast-header-break-point class instead of media query. So that CSS will work fine for different breakpoints. 

    .ast-header-break-point #secondary .sidebar-main{
    display: none;
}

    Regards,
    Anjali Chavan

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to disable sidebar on mobile devices’ is closed to new replies.