• Resolved mattjakob

    (@mattjakob)


    Hello,
    I am trying to create a layout template where I spread The Loop into 4 columns. Is it there a way to create a 4 coulumn text flow layout?

    W3C has this feature: http://www.w3.org/TR/css3-multicol/ which is quite close to what I mean besides the fact that you need to specify a COL class statement for the beginning/end of each column… this could be tricky to do within The Loop as I would have to instruct the loop to put these instructions every – let’s say – 5 posts (so I have 5 posts for each column, 5 x 4 = 20 posts in total).

    Many thanks.

Viewing 7 replies - 1 through 7 (of 7 total)
  • So you want to use one loop but split the results across 4 columns?

    That should be easy enough, just increment the value of a variable which each result, and if the variable has a value that is a multiple of 4 or 0 then create a column, or new DIV, whatever you prefer…

    Example.. (with table just for example purpose)

    <?php
    $mycount = 5
    
    $arraynums = array(5,10,15,20)
    ?>
    <table><tr>
    <?php while(doing your usual loop stuff) { ?>
    
    if(in_array($mycount ,$arraynums)) {
    $tcol = '<td>';
    $tcolend = '</td>';
    } else {
    $tcol = '';
    $tcolend = '';
    }
    echo $tcol;
    ?>
    <div class="somediv for your post">some post etc etc...</div>
    <?php
    echo $tcolend;
    $mycount++;
    } ?>
    </tr></table>

    Basically each time a post is shown the $mycount variable is increased +1, we check if the value is equal to 5, 10, 15 or 20, if it is then we give $tcol and $tcolend a value, which basically creates a column around the post content…

    That’s untested, but in theory it should work…

    Sorry should have tested that, it will only surround the first, fifth and so on posts, not containing all 5…

    I’ll have a little think, i’m sure it’s a matter of looking at it from the right angle…

    Should be easy enough… let me have a play around and i’ll post something else back…

    <?php
    if (have_posts()) : ?>
    <table><tr><td>
    <?php $icnt = 1;
    while (have_posts()) :
    the_post();
    if($icnt == 5 || $icnt ==10 || $icnt ==15) : ?>
    </td><td>
    <?php
    endif;
    ?>
    
    Your normal post stuff...
    
    <?php
    $icnt++;
    endwhile;
    ?>
    </td></tr></table>

    Whenever $i is equal to 5, 10, or 15 close the column and start a new one before the post DIVs, content etc…… 🙂

    That ‘should’ work unlike the first one…

    Thread Starter mattjakob

    (@mattjakob)

    Actually I made

    $mycount = $mycount % 4;
    $mycol = $mycount + 1;

    before the post DIV

    and then

    $mycount++;

    after the post DIV

    In this way I have a correct ‘columnID’ assignment for each post.
    Thanks!

    There’s a number of ways you could do it….

    Whichever works… 🙂

    Thread Starter mattjakob

    (@mattjakob)

    Hehe indeed. It’s just I am a bit slow with PHP and wordpress (basically I nvever looked into them).

    You sound quite knowledgeble… do you have any suggestion for this as well ?

    http://wordpress.org/support/topic/250906

    Afraid not, i’m not really that clued up on JS/Ajax…

    I’m looking for something to do the same, but not found something suited to adapt yet…

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘[HELP] Multi-column flow ?!?’ is closed to new replies.