Zikula Community

• nunizgb
  

  • Registered: Dec 31, 1969
  • Last visit: Mar 05, 2010
  • Posts: 72

  Posted: Apr 23, 2009 - 04:27 AM

  hello,
  
  Is it possible to have 4 colone in BlankTheme in fact split into 2 position where is center block
  
  this is original code
  
  

  Code

  <div class="c62l">
  <div id="col1_content">
  <!--[if $layout|checkzone:nc ne true]-->
           
  <!--[blockposition name='center']-->
  <!--[/if]-->   
  <!--[$maincontent]-->
  </div>
  </div>

  
  
  i have done this and i got split into 2 but the size of center block is too small so the text couldn't be show
  
  

  Code

  <div class="c62l">
  <div id="col1_content">
  <div class="c50l">
  <div id="col4_content">
   <a id="navigation" name="navigation"></a><!--[blockposition name='navleft']-->
   </div></div>
  <!--[if $layout|checkzone:nc ne true]-->
           
  <!--[blockposition name='center']-->
  <!--[/if]-->   
  <!--[$maincontent]-->
  </div>
  </div>

  
  
  So which code of CSS i must modified for changed size of center block BTW i have put this in slim_base.css
  

  Code

  c63r{float:right;margin-left:-5px}
  c63l{float:left}
  .c63l,.c63r{width:38.2%}
  #col4{width:auto;margin:0 200px}
  #col4_content{position:relative}

  
  
  this in basemde.css
  
  

  Code

  #col4 {
      margin: 0 25%;
    }
      #col4_content {
        padding: 0 10px;
      }      
   /* #col2 contains the left blocks */
    .bt_3col #col4 {
      float: left;
      margin: 0;
      width: 120px;
    }
    .bt_3col #col4_content {
      padding: 0 10px 0 15px;
    }

  
  
  but the resultat is not good sowhat must be done to have a size for leftnav position block and center block?

  • 
  •  
• nestormateo
  
  

  • Rank: Team Member
  • Registered: Sep 06, 2006
  • Last visit: May 09, 2010
  • Posts: 2446

  Posted: Apr 24, 2009 - 03:50 AM

  Hi!
  4 columns? or split in 2 subcolumns the current center blocks container?
  split is pretty easy with the YAML subtemplates as you have tried to do it:
  

  Code

  <div class="subcolumns">
    <div class="c50l">
      <!--[blockposition name='navleft']-->
    </div>
    <div class="c50r">
      <!--[blockposition name='center']-->
    </div>
  </div>

  
  
  But in the code you posted you are using some inconsistent subcolumns widths like: 62% and 50% = 112% that can be the cause of your problems. Check the subtemplates docs of the above link and i guess that the examples there are pretty clear
  
  In the other hand, please don't modify the YAML core (slim_base.css) because the YAMl Framework core files should not be touched. Anyways, the things you need are already supported just using the c38l and c62r classes for your subcolumns
  
  When using subtemplates, is not required to use ids like col4, but if you want to do some special stuff or identify them, well, it's a matter of tastes
  Any link to check your layout?
  
  Greetings!
  
  --
  - Mateo T. -
  Mis principios... son mis fines

  • 
  •  
• nunizgb
  

  • Registered: Dec 31, 1969
  • Last visit: Mar 05, 2010
  • Posts: 72

  Posted: Apr 24, 2009 - 04:48 AM

  hi
  
  i want to do this split in 2 subcolumns the current center blocks container
  
  thanks for link i will study that and not there is no link to check layout because i work in local for the moment and thanks for info about to not modify core yaml files.
  
  One question for author of BlankTheme is it possible to put a link to personnal style some where in head file. So if a basemode & content CSS files are update to SVN our modification to CSS file aren't lost ? good job
  
  Edit : I have made it thanks Mateo
  
  Could you check just if code is optimised thanks
  
  

  Code

  <!-- begin: main content area #main -->
          <div id="main">
              <!-- skiplink anchor: Content -->
             
              <a id="content"></a>
                  <div class="subcolumns">
                  <div class="c62l">
                     <div id="col1_content">
                        <div class="subcolumns">
                           <div class="c25l">
                              <!--[blockposition name='navleft']-->
                           </div>
                           <div class="c75r">
                              <!--[blockposition name='center']-->
                           </div>
                        </div>
                     <!--[$maincontent]-->
                     </div>
                  </div>
                  <div class="c38r">
                     <!--[if $layout|checklayout:123 OR $layout|checklayout:132]-->
                     <div class="subcolumns">
                        <div class="c50l">
                           <div id="col2_content">
                              <!--[if $layout|checklayout:123]-->
                              <!--[blockposition name='left']-->
                              <!--[else]-->
                              <!--[blockposition name='right']-->
                              <!--[/if]-->
                           </div>
                        </div>
                        <div class="c50r">
                           <div id="col3_content">
                              <!--[if $layout|checklayout:123]-->
                              <!--[blockposition name='right']-->
                              <!--[else]-->
                              <!--[blockposition name='left']-->
                              <!--[/if]-->
                           </div>
                         </div>
                     </div>
                     <!--[else]-->
                     <div class="subcr">
                      <!--[if $layout|checklayout:12]-->
                          <!--[blockposition name='right']-->
                      <!--[elseif $layout|checklayout:13]-->
                          <!--[blockposition name='left']-->
                      <!--[/if]-->
                      </div>
                      <!--[/if]-->
                  </div>
              </div>
  
              <!--[if $layout|checkzone:3b]-->
              <div id="bt_3b" class="bt_zone subcolumns coolsubcol">
                  <div class="c33l">
                      <div class="subcl">
                          <!--[blockposition name='bottoml']-->
                      </div>
                  </div>
                  <div class="c33l">
                      <div class="subc">
                          <!--[blockposition name='bottomc']-->
                      </div>
                  </div>
                  <div class="c33r">
                      <div class="subcr">
                          <!--[blockposition name='bottomr']-->
                      </div>
                  </div>
              </div>
              <!--[/if]-->
          </div>
          <!-- end: #main -->

  • 
  •  
• nestormateo
  
  

  • Rank: Team Member
  • Registered: Sep 06, 2006
  • Last visit: May 09, 2010
  • Posts: 2446

  Posted: Apr 24, 2009 - 08:34 AM

  Ok
  check the code, i've edited it
  i've removed the nc zone check, because i guess you always need the center blocks for that layout. Also moved the $maincontent inside the #col1_content container for paddings.
  
  Indent always helps too.
  The rest is like the grid layout, so there's no problem
  
  You'll be able to have 4 columns with 123, 132 layouts
  or just 3 with 12, 13... and the 3b zone...
  are you using 123_3b? hope it looks awesome
  
  And about include another CSS file
  you can insert the link inside the htmloutput BlankTheme plugin; there's the head section.
  
  Greetings!
  
  --
  - Mateo T. -
  Mis principios... son mis fines

  • 
  •  
• nunizgb
  

  • Registered: Dec 31, 1969
  • Last visit: Mar 05, 2010
  • Posts: 72

  Posted: Apr 24, 2009 - 09:12 AM

  thanks when i finish and put on net i will give i link to see in action

  • 
  •  
•  
•  

Users on-line

• 0 users

This list is based on users active over the last 60 minutes.