Fork me on GitHub

columns in a section loop  Bottom

  • ..i'm just trying to finish up this job. I need to display the items in 2 columns, but they're in a loop. now, I'm sure I can "hardcode" the divs and make this work, but I'd prefer not to..

    here's a tid-bit.. maybe someone can help:

    Code

    <!--[section name="conitems" loop=$conitems]-->
    <div class="conitem"><span class="conitem"><!--[$conitems[conitems].title|pnvarprepfordisplay]--></span></div>
    <!--[/section]-->


    ..maybe add a container above the section and make the div class 50%? won't work without a float, i don't think .. I'll have to give that a go later, but i'd appreciate any input.. thanks.
  • ..maybe a plugin to alternate the class and apply the floats .. that should work.

    ugh.
  • Devin,

    When I needed a two column table, I used the html_table function in Smarty. Don't know if it is suitable for you, but incase you are interested, see the link below.

    http://smarty.php.net/manual/en/language.function.html.table.php

    --
    itbegins.co.uk - Zikula Consulting

    birtwistle.me.uk - Personal Blog


    Please read the Support Guide
  • why hello Simon :D ..thanks for the assist, but it won't cure my woes ;)

    ..i think i've got a solution, but I need to try it first.. theoretically it should work fine.. just looping the 2 classes in the same section within a container.

    ..might be more "user friendly" to use inline styles and define them in the language files..so they don't have to fiddle with a plugin or source file.

    I'll post the code as soon as I know it works for future reference.

    thanks again Simon :D
  • ..just posting this for anyone else who might need it at some point.. it's a bit of a hack, but works.

    when building the section loop from an API call:

    Code

    $items = pnModAPIFunc('MODULE', 'user', 'getall', array('catid' => $catid));

    $i = 0;
    foreach($items as $item) {

    if($i%2 == 0) { // assign styles left & right
      $style = 'float:left; width:48%; text-align: justify; border:1px solid #ff0000;';
      $i++;
    } else {
      $style = 'float:right; width:48%; text-align: justify; border:1px solid #0000ff;';
      $i++;
    }

    $items[] = array('style' => $style,
                             'title' => $item['title']); // build item array
    }

    $pnRender->assign('items', $items); // assign item array to template
    return $pnRender->fetch('template.htm'); // return the template

    ..in this loop just the title and styles are added to the $items array, then assigned to the template. Their borders are colored to detail the example.. left is red, right is blue.

    this is the template the variables were assigned to:

    Code

    <div style="width:90%; border:1px solid #000000; margin: 0 auto; text-align: justify;">
    <!--[section name="items" loop=$items]-->
     <div style="<!--[$items[items].style|pnvarprepfordisplay]-->">
    <span class="item"><!--[$items[items].title|pnvarprepfordisplay]--></span>
    </div>
    <!--[/section]-->
    </div>

    ..the container is colored as well (#000000).. the loop appears to break it, but the items are still contained. This example produces a left to right, ordered, 2 column layout without tables..

    that's all i've got.. if anyone can improve it; please, please do.
    -IR
  • Mark West, got any other tips on this process? Im wanting to use something like this for one of my prendered modules as well. Its a list that is alphabetical and i want it to fill the first column, then the second, third and so on. The number of columns will depend on the size of the list. Hmm. Here is the look that i have statically made right now.

    http://absreport.com/AboutUs-contacts.htm
  • 0 users

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