• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple Netherlands

All times are UTC




Post new topic Reply to topic  [ 2 posts ] 
Author Message
 Post subject: Website lay-out wijzigen afhankelijk van de paginainhoud
PostPosted: Thu Feb 23, 2012 8:55 am 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Wed Apr 23, 2008 7:53 am
Posts: 7586
Location: The Netherlands
De websites die ik maak probeer ik altijd met zo weinig mogelijk templates te maken. Simpelweg omdat de technische kant van de website overzichtelijker blijft en daardoor voor de developer, maar ook voor de eindgebruiker eenvoudiger is bij te werken.
Zo moest ik voor mijn schoonvader een website maken met verschillende pagina lay-outs, dat willen zeggen 1, 2 óf 3 kolommen met content.
Met wat Smarty heb ik het toen zo gemaakt dat afhankelijk van het vullen van de drie beschikbare Content blokken de pagina lay-out automatisch wordt aangepast...

Stylesheet
Code:
div#content {
        min-height: 300px;
        border: #ccc 2px solid;
        background: #fff;
}

div#sidebar-left {
        float: left;
        width: 375px;
        padding: 10px 15px;
}

div#sidebar-right {
        float: right;
        width: 375px;
        padding: 10px 15px;
}

HTML Template
Code:
{* Start Content *}
<div id="content">

{content block="content_left" wysiwyg="true" label="Left column" assign="content_left"}
{content label="Main content (Required)" assign="content_main"}
{content block="content_right" wysiwyg="true" label="Right column" assign="content_right"}

{* Start sidebar left *}
{if $content_left}

{literal}
    <style type="text/css">
div#main {
padding-left: 410px;
}
    </style>
{/literal}

<div id="sidebar-left">
{$content_left}
</div>
{/if}
{* End sidebar left *}

{* Start sidebar right *}
{if $content_right}

{literal}
    <style type="text/css">
div#main {
padding-right: 410px;
}
    </style>
{/literal}

<div id="sidebar-right">
{$content_right}
</div>
{/if}
{* End sidebar right *}


{* Start Content *}
<div id="main">
{$content_main}
</div>
{* End Content Area *}

<div class="clear"></div>
</div>
{* End Content *}

Niet helemaal W3c valid, maar erg flexibel ;)

Grtz. Rolf :)

_________________
Image

Did my post help you solving a problem at your (customers) website and it saved you many hours of work? Great!! Consider buying me a cup of coffee in return! [ Click here ]



Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: Website lay-out wijzigen afhankelijk van de paginainhoud
PostPosted: Fri Feb 24, 2012 11:17 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Tue Mar 31, 2009 8:45 pm
Posts: 377
Location: Delft, Netherlands
Nice! Ik zie gelijk al legio mogelijkheden. Denk alleen dat het op mijn eigen site erg veel werk zou zijn om de pagina's aan te passen op een andere template.
Heb je misschien een live sample? Heb wel zin om ff wat met de HTML te experimenteren (met firebug).


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 2 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
A2 Hosting