Need help with side bars and using whole page

[tristam]

With Home page / Brochure pages I would like to use the whole screen and have no side bars

With product pages I would like to do the same.

With section list pages I would like to keep it as it is with filtering down the left and brochure page list on right. This can be changed if this is too complicated to get rid of the right side bar.

www.thepenzone.co.uk

[UKCCSam]

I think there's an option for full width header with no/left/right sidebars. You could change that for the sections manually.

Or you want a more automatic method, you could go into Design view and put block_ifs around the left and right sidebars, for "Section" page types.

[tristam]

I can only see options for 1 or 2 side bars but not no side bars. There are already block if around the left and right sidebars.

[peblaco]

Quick fix for 1 or 2 sidebars for different pages:

1) Design menu > Library > Variables > Design Wizard > Wiz3_Sidebars > To cascade the setting for sub-sections tick "Allow <Use Parent> as an Option". Change "Initial Value" to "Use Parent ()". Top Level Value > "One / Two Sidebars" - choose your site default. OK > Close.
2) Settings menu > Site Options > Design Wizard > change "One or Two Sidebars" to "Use Parent (=One / Two Sidebars)". That sets the site default. Apply > OK.
3) Design menu > Library > Variables > Design Wizard > Wiz3_Sidebars > Under "Place Of Setting" tick Section / Brochure / Product as required. OK > Close.
4) Design menu > Library > Web Page Outer Layout > Responsive Layout > Find code: <div id="left-area">
Change to: <div id="left-area<actinic:block if="%3cactinic%3avariable%20name%3d%22Wiz3%5fSidebars%22%20%2f%3e%20%3d%3d%20%22One%20Sidebar%22">-onesidebar</actinic:block>">
5) Design menu > Library > Web Page Outer Layout > Smart / Classic Responsive Stylesheet > at the bottom add: #left-area-onesidebar {width:100%;}
6) Content tree go to a page or product > Design Wizard tab > Change sidebar setting to "One / Two Sidebars".

Note: Fixes need testing, no liability use at own risk.

[tristam]

Thanks for this.

I am still a little lost though.

Can I have no side bars?

[peblaco]

It can be done but needs custom code changes.

[tristam]

OK Thanks for your help. I think I will stick with one side bar for now and look again in the the future.

[John Ennals]

I've posted on the thread below a method of specifying a maximum desktop page width for sites that have a mixture of one-sidebar and two-sidebar pages:

http://community.sellerdeck.com/show...682#post347682

John

[saucysal]

Can I check?

Thank you Louise. I saw your posting but was not sure how to adapt it to change the width of the left side bar. Would I be correct in thinking that I just go to Design: Library: Theme Stylesheets: Responsive CSS and at the bottom add:

#left-area-onesidebar {width:75%;} or whatever percentage works to reduce the width of the invisible left sidebar?

Sarah

[peblaco]

The #left-area-onesidebar code changes the width of the #left-area container around the left sidebar and content area. You could customise the code but it would need testing.

If you want no side bars it would need code changes, see a simple fix posted by SellerDeck at: Possible to have no sidebars?

Note: If you delete the sidebar code altogether it stops Filtering options uploading, pages with Filtering the pagination stops working it shows all products and the mobile menu for Filtering is empty.

[malbro]

If you delete the sidebar code altogether it stops Filtering options uploading, pages with Filtering the pagination stops working it shows all products and the mobile menu for Filtering is empty.

The responsive design uses javascript that looks for specific id's on the<div> and other tags in the code and then uses them to locate certain areas. Deleting the left sidebar code deletes these tags and the javascript then stops working. For example there is a javascript section to move a number of page areas to a different location in the page depending on the width of the page, this controls the top bars that appear for menu, filtering etc in the mobile sizes but appear in the left sidebar for larger tablets and desktop devices

[graphicz]

#idBreadcrumbsTop, #idBreadcrumbsBottom {
	float:left;
	margin:1em;
}
.content-area #product-page-body {float:left; width:100%;margin-left:1em;}

#terms-body p {float:left; clear:both; margin-left:1em;}

form.login {margin:1em;}