Splitting the WordPress loop · vanrossum.dev    

       vanrossum.dev 

 Article

Splitting the WordPress loop
============================

 ![](https://vanrossum.dev/images/jeffrey-portrait.webp) By Jeffrey van Rossum

  vanrossum.dev  

  [      vanrossum.dev ](https://vanrossum.dev)                      

  [ ← Writing ](https://vanrossum.dev/posts)   [ ← Writing ](https://vanrossum.dev/posts) [ Likely approach ](#likely-approach) [ Alternative approach ](#alternative-approach) [ Conclusion ](#conclusion) 

Today I needed to make a post archive page for a WordPress-theme that contained several different grids in one loop. For example, the first two posts needed to be in a 50/50-grid. The following three ones in a 33/33/33-grid and the rest in a list view. The following image will illustrate what I mean.

![](https://user-images.githubusercontent.com/9550079/97467270-4faadb80-1944-11eb-9427-e87c5b02ba9f.png)Likely approach
---------------

For these kind of pages, you often end up going through [the loop](https://codex.wordpress.org/the_loop) while keeping a counter. Then, with quite a bit of if-statements, you check which partial you need to show and whether you need to open or close a grid-wrapper.

Let's take a look at an example of the code that we would end up with. And this example is probably a slimmed down version of what you would end up with in a finished template.

```php
