The Post Loop Builder is a powerful element that allows you to display lists, or “loops”, of WordPress posts in your designs. These items are displayed within a Component and designed with Oxygen’s dynamic data features to display the appropriate information for each post.

Implementing the Post Loop Builder

Before you add the Post Loop Builder element, you should first create a Component.

Adding the Post Loop Builder Element

1. Open the page where you want to display the Post Loop Builder in Oxygen.
2. Add the Post Loop Builder element to the page.
3. Select the Component you created in the step above as the template for each post in the loop.

Configuring the Post Loop Query

The Post Loop Builder uses the default WordPress query for the Page or Template. It also supports the ability to customize the query as needed. You may find more information about the different queries available in Oxygen through the following documents:

• Array Query
• Custom Query
• Text Query

Customizing the Display Layout

After you’ve set the Component and defined the query, you can customize the layout for how the posts will be displayed on the page.

Choosing the Layout

In the List section of the Design Tab, you can change the Layout of the Post Loop Builder with three different settings:

• List: Display the posts in a one-column list
• Grid: Display the posts in a grid with 1 or more posts per row
• Slider: Use a slider to display the posts.

Each layout has additional settings you can use to fine-tune the layout.

Styling the Post Loop Builder

The Post Section will allow you choose a background color and set the borders and paddings for the posts. Please note that to modify the layout of each post, you will need to edit the Component you selected.

The Container Section is where you can choose the overall styles for the parent container of all the posts.

Using Pagination

The Post Loop Builder element provides several different pagination options. You may learn more about pagination here.

Using the Filter Bar

The Filter Bar allows you to utilize Isotope filtering to filter the posts on the front end. For more advanced filtering, we recommend using FacetWP or WP Grid Builder.

Please note that the Filter Bar and Pagination options cannot be activated simultaneously.