How can I hide the sidebar on mobile devices?

Hi,
how can I, if possible hide the sidebar on mobile devices?
Best regards
Anne

Hey Anne,

Thanks for writing around! Please add the following CSS code in the Theme Options > Global CSS or in the Customizer via Appearance > Customize > Custom > Edit GLOBAL CSS

@media screen and (max-width: 979px) {
    .x-sidebar {
        display: none !important;
    }
}

Cheers!

Thanks! Will that make all sidebars not show on mobile devices or can I choose which ones I want to hide it on?

Hi,

Do you mean which page you want it to hide?

You can add page id or post id on your css code.

eg.

@media screen and (max-width: 979px) {
    .postid-1135 .x-sidebar {
        display: none !important;
    }
}

or

@media screen and (max-width: 979px) {
    .page-id-414 .x-sidebar {
        display: none !important;
    }
}

Here is how to find your page or post id

Hope that helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.