removing sidebar from a single page

[beeswax]

using CMSMS v.1.0.4 to develop a site and the template CSSMenu top + 2 columns, which has the sidebar with content tags. On a couple of pages I need to display items full width, without the sidebar. My idea was to copy the CSSMenu top + 2 columns template, comment out the sidebar, attach stylesheets and set it as the template for those pages where I didn't want a sidbar...and that's where it went horribly wrong. Am I on the right track or a complete screw up?

[RonnyK]

Beeswax,

if you copy the template and then delete (or comment out) the DIV for the column you want to disappear, it should work. You might also, delete the two divs that now divide the content and only have your content DIV left. I commented the lines in RED, I think you can comment out. This way you don't have to change any other stylesheet or what so-ever. The only additional thing is a template with the same attached stylesheets as the original.

   
   

     
     
         {content block='Sidebar'}
     
     

     
     
         {print showbutton=true script=true}
         {title}
         {content}


         


{anchor anchor='main' text='^ Top'}

         
            {cms_selflink dir="previous" label="Previous page: "}

            {cms_selflink dir="next"}
         
         


     
     
 


   
   

By doing this you don't have to spread the remaining div over the page as both divs are wrapped inside the div content.

Otherwise you only delete the div for sidebar, and additionally change the width of the css for the remaining DIV main to margin-left 0% and margin-right 0%, to keep the original styling for the DIV main. Both methods should work, maybe this last one is the best/easiest.

Ronny

[kermit]

the easy way, without making a new template....

flip-flop {stylesheet} and {metadata} in the 'CSSMenu top + 2 columns' template, so that {stylesheet} comes FIRST.

in the meta data (option tab) for the page you want as one column, add:

{literal}

div#sidebar {display:none;}
div#main {margin-left:2%;}

{/literal}

note that this method will not eliminate the sidebar content block, just hide it from display; and the sidebar content block editing window will still appear on the page editing pages. that content, if any, will still be in the output source, it just won't be shown on the screen if the above styles are applied to a page.


OR, you can duplicate the template and make the necessary edits:

1. copy the template 'CSSMenu top + 2 columns'
2. copy the stylsheet 'Layout: Top menu + 2 columns'
3. add the following to the end of the newly created copy of the stylesheet (or find the right place within the css and make the edit instead, but just adding this to the end of it is easier):

div#sidebar {display:none;}
div#main {margin-left:2%;}

4. template/css association: remove the 'old' stylesheet from the new template, add the 'new' stylesheet to it instead.
5. edit the new template (not absolutely required, but doing so will remove the now useless sidebar content block while editing this particular page), remove the following from it:

     
     
        {content block='Sidebar'}
     
     

5a: if you edit the template as above, you only need the 2nd line in 3. added to the end of the 'new' stylesheet.
6. assign the one-column page the new template.

note the margin-left can be whatever you want.. 1em, 2em, 2%, etc..  the value here is how far from the left edge the page content will be. 2% looks fine here on a window up to 1280px wide (the maximum resolution of my screen)