HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


Selective 2-column display in a 3-column theme

Scenario: User wants to use theme with 3-column display. However, user thinks some pages are better displayed in a wider space than the middle section of a 3-column display allows, so would like to hide one of the panels for specific pages.

Problem: Removing a side panel affects all pages, and does not achieve the required result of only hiding the panel for a specific page.

Solution: Edit global.tpl to tell the software how to display the page(s) that are required to display without a left or right panel. In this example we have selected the 'list members' page and the 'view member page' (members:type=misc,:members:type=view), and chosen to remove the right panel (right_width), allowing the rest of the site to display as a normal 3-column display.

How: Select the following lines of code from global.tpl:

Code


{+START,IF,{$NOT,{$MOBILE}}}
   {$,Work out the panel/central CSS widths}
   {$SET,left_width,{$?,{$IS_EMPTY,{$TRIM,{$GET,panel_left}}},0,{$PANEL_WIDTH_SPACED'}}}
   {$SET,right_width,{$?,{$IS_EMPTY,{$TRIM,{$GET,panel_right}}},{$?,{$GET,helper_panel},{$?,{$HIDE_HELP_PANEL},26px,275px},0},{$PANEL_WIDTH_SPACED'}}}
   {$SET,middle_width,auto}


and change to:

Code


{+START,IF,{$NOT,{$MOBILE}}}
   {$,Work out the panel/central CSS widths}
   {$SET,left_width,{$?,{$IS_EMPTY,{$TRIM,{$GET,panel_left}}},0,{$PANEL_WIDTH_SPACED'}}}
   {$SET,helper_panel_width,{$?,{$HIDE_HELP_PANEL},26px,275px}}
{$SET,panel_width_if_no_panel,{$?,{$GET,helper_panel},{$GET,helper_panel_width},0}}
{$SET,has_no_panel,{$IS_EMPTY,{$TRIM,{$GET,panel_right}}}}
{$SET,uses_special_width,{$MATCH_KEY_MATCH,:members:type=misc,:members:type=view}}
{$SET,special_width,0}
{$SET,panel_width_if_has_panel,{$?,{$GET,uses_special_width},{$GET,special_width},{$PANEL_WIDTH_SPACED'}}}
{$SET,right_width,{$?,{$GET,has_no_panel},{$GET,panel_width_if_no_panel},{$GET,panel_width_if_has_panel}}}
   {$SET,middle_width,auto}


Confused? Don't be disheartened! Watch the following videos, compiled by Chris Graham, for a full explanation as to how and why this edit was done in this manner, and you will be surprised at how easy it is to follow the thinking:

If you wish to read the original thread that raised the issue in the Forums, go to Calling all Coders, and you will be able to follow the various responses to this request.

Note: Version 9 of ocPortal will simplify this procedure by giving you the choice of achieving a similar result by editing the CSS, e.g.


.page_running_downloads #panel_right {
        width: 150px;
}

There are no pages beneath this page

There are no posts yet

CEDI change-log Post