How to setup 2 col. content design best way...

[Bekker]

Hi!

Im working on a design, where the admin should be able to add pages in 2 different ways.
1st.:
single colum content design, easy enough... like: http://www.juleshow.dk/kobenhavn/showet

2nd.:
2 colum content, where admin is able to add to content in 2 cols..
like this: http://www.juleshow.dk/

I was thinking about a structure like this:

Code: Select all

Home (2col page)
 - Left
   - Content block
   - Content block
 - Right
   - Content Block

Page (single col page, with content indside this node)

And then make some sort of smarty that could see if Left and right is there, and then output it the right way.
And and if not, just make a single colum with the content...

Not sure how though, and am i going about this the right way?

[paulbaker]

Not sure how though, and am i going about this the right way?

That's probably the way I would do it. That doesn't mean it is the best way though! Interested in other's ideas on this.

[calguy1000]

in your template you could do something like:

Code: Select all

{content assign='main_content'}
{content block='othercolumn' assign='othercolumn'}

{* using twitter bootstrap scaffolding *}
<div class="row">
{if $othercolumn != ''}
  {* want 2 column layout *}
  <div class="span4">{$othercolumn}</div>
  <div class="span8">{$main_content}</div>
{else}
  {* want one column layout *}
  <div class="span12">{$main_content}</div>
{/if}
</div>

This would provide two content areas for editors. if the second one was filled in you would get a 2 column layout... otherwise you would get a one column layout.

[Rolf]

https://www.cmscanbesimple.org/blog/cha ... ge-content

[velden]

Just curious: why not making two different (inherited) templates?

[Bekker]

Hi guys!
Thanks for all the ideas...

I have been looking on the content block concept.
But its not really what im looking for, i want to able to add "blocks" of content.
Like a news feed.... and then be able to put them i either right or left.
Or just display 1 full page.

Is it possible to get sub items of a page in smarty? so i could foreach them out or somthing? and then use somthing like the structe i wrote in my initial post?

[velden]

So you want to have to have the possibility to add blocks of content to a page. Without knowing how much beforehand?

And on each block you should be able to choose right or left position?

You might want to look at the module ListIt2/ListitExtended http://dev.cmsmadesimple.org/projects/listit2

However, it will be a little less simple for an editor to add content when it comes to adding a new page.

An items in ListIt2 could be a content block. You could define custom fields so editors can choose either right or left.

But then you must have a possibility for each item to tell it to which page(s) is belongs. Could be a category for example, but you should define those categories before. If an editor adds a new PAGE then a new category should be added.

Things get less complicated when no new pages will be added.

I got a feeling there is a better solution I'm not aware of...

[Bekker]

Well the overall pages shouldnt change...
Only the content blocks...
So not sure if the list plugin is the right thing...

if i build a content structe like this:

Code: Select all

Home
 - Left
   - Block of content
   - Block of content
 - Right
   - Block of content
   - Block of content
   - Block of content
SomePage
 - Block of content

And then some smarty code in laylout to control it.
but not sure how to get the sub pages with smarty?

[applejack]

Re: not sure how to get the sub pages with smarty?

Use CGSimpleSmarty module then you can pull in content from other pages.

[chrisbt]

The following might be the solution that you are looking for. I am now using something similar to the following as a default site layout.

Requires ECB module.

Code: Select all

{content label='Top Section' assign='content1'}

{content_module module='ECB' field='dropdown' block='leftSidebarOptions' label='Left Sidebar Options:' values='--- none ---=,Latest News=latest-news,News Categories=news-categories,Request Catalogue=request-catalogue,Social Media=social-media' multiple=1 size=5 assign='leftSidebarOptions'}

{content_module module='ECB' field='dropdown' block='rightSidebarOptions' label='Right Sidebar Options' values='--- none ---=,Latest News=latest-news,News Categories=news-categories,Request Catalogue=request-catalogue,Social Media=social-media' multiple=1 size=5 assign='rightSidebarOptions'}

{if $leftSidebarOptions && $rightSidebarOptions}
   {$leftSidebarWidth='grid2'}{$contentWidth='grid8'}{$rightSidebarWidth='grid2'}
{elseif $leftSidebarOptions && !$rightSidebarOptions}
   {$leftSidebarWidth='grid2'}{$contentWidth='grid10'}{$rightSidebarWidth=''}
{elseif !$leftSidebarOptions && $rightSidebarOptions}
   {$leftSidebarWidth=''}{$contentWidth='grid10'}{$rightSidebarWidth='grid2'}
{else}
   {$leftSidebarWidth=''}{$contentWidth='grid12'}{$rightSidebarWidth=''}
{/if}

...

<div id="main" class="row"><!--______ main ______-->
{if $leftSidebarWidth}
   <aside id="left-sidebar" class="{$leftSidebarWidth}">
      {global_content name='optionsLeftSidebar'}
   </aside>
{/if}

   <div id="content" class="{$contentWidth}">
      {$content1}
   </div><!-- content -->

{if $rightSidebarWidth}
   <aside id="right-sidebar" class="{$rightSidebarWidth}">
      {global_content name='optionsRightSidebar'}
   </aside>
{/if}

</div><!-- main-->

Then a GCB 'optionsLeftSidebar' & something similar for the right.

Code: Select all

{$options=","|explode:$leftSidebarOptions}
{foreach $options as $option}
{if $option=='education-promo'}
{elseif $option=='latest-news'}
      {news number='5' summarytemplate='News_Titles'}

{elseif $option=='news-categories'}
      {news action='browsecat'}

{elseif $option=='request-catalogue'}
      <img src="{uploads_url}/images/website-images/request-catalogue-temp.jpg" class="bottom3" />

{elseif $option=='social-media'}
      <img src="{uploads_url}/images/website-images/social-media-temp.jpg" class="bottom3" />

{/if}
{/foreach}

Note: inspiration taken from http://www.i-do-this.com/blog/36/Give-Y ... ir-Sidebar
plus the many other awesome devs that contribute to CMSMS and this forum.