The main reason we go for side menus rather than horizontal top-menus is that they are much more resilient to having a varying number of items in the menu. A horizontal menu can only have a limited number before they're "full". Since we have no control over the content that users put on their sites, the side menu is really the only "safe" way of doing this.

Anyway, back to your question!

There's no way of turning the menu etc off completely, though what you could do is to create a custom theme which hides them. You'll need to know a bit about HTML/CSS for this.

If there are specific content pages on which you want to hide the menu, what might work well is to create a custom includelet with some inline CSS in it which hides certain elements of the page. For example, to hide the menus you could do something like this (note that I've not actually tried this, but I think it should work!)

In the custom includelet, source view, add HTML:

<style type="text/css">
<!--
  @media handheld {
    #navigation { display:none; }
  }
-->
</style>

Or, if you prefer to add all your custom CSS into a stylesheet file - that's fine. Upload the file into the assets library and then link to the stylesheet like this:

<link rel="stylesheet" href="/mysite/assets/custom-theme/name-of-stylesheet " type="text/css" media="handheld" />

The easiest way to find out what the ids and classes of page items to hide is to look at the page itself. Note that the relatively new themes of Playtime and Darktones use a different HTML structure to the older themes, and so have different elements that you'll want to hide.

One thing I've been considering, but not yet implemented, is a facility for users to add their own custom stylesheets to be used as well as the styles for their chosen theme, rather than instead of. That way you could have the theme out of the box and just add any tweaks that you want to.

Thanks

Voice Admin

It worked when I inserted an extra css file on the modern template with this coding:

@media only screen and (max-width: 1026px) {
    #leftcol {
        display: none;
    }
}