Multiple loops? for a three-column layout

  • stinkybritches

    (@stinkybritches)


    11 years, 4 months ago

    I’ve searched through the codex and the forums, and have found some info that’s helpful, but none that seems to apply to my specific situation.

    What I’m looking to do is have an index.php with a pinterest-style layout. I.E. multiple columns with posts in each. The code looks something like this:

    <div class="left column">
-- posts here --
</div>

<div class="center column">
-- more posts here --
</div>

<div class="right column">
-- more posts here --
</div>

    Normally this would be simple to do using just one Loop, but for formatting reasons, I need to have that HTML code separating the columns (I’m going for a pinterest-style layout). The posts to be displayed should be pulled from all categories. It would be nice to limit the number of posts displayed in each column, but I’d be happy with being able to limit the total number of posts displayed on the page (in all columns).

    Do I need multiple loops to do this? If not, what code do I need to use in each column to be able to continue the Loop with the same arguments without duplicating posts?

Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    11 years, 4 months ago

    You could modify the loop code of your template to track the post count and insert appropriate html when ever the count hits certain amounts. For example, if you have 30 posts per page, before the loop output the left div html. After 10 posts, output the close left div and open center div. After 20 posts, output close center dive and open right div. Then output close right div after the loop.

Viewing 1 replies (of 1 total)
  • The topic ‘Multiple loops? for a three-column layout’ is closed to new replies.

Tags