How to Create the Collection Template in Bricks Builder

This guide will cover the key steps for setting up a collection template in Bricks Builder with SureCart’s integration.

Using this integration, you can easily customize and design e-commerce collection pages by taking advantage of SureCart’s dynamic elements within Bricks.

Let’s dive in!

Creating SureCart Collection Archive Template

To apply a consistent layout to all your collections pages in Bricks, you need to create a SureCart Collection Archive Template.

To create the SureCart Single Product template, follow these steps:

• Go to Bricks > Templates (1).
• Click the Add New button (2).

• Give the template a name; in this case, “Collections Template” (1).
• In the Template type dropdown, select SureCart – Single Product (2).
• Click the Publish button (3).
• Then click the Edit with Bricks button (4) to start designing your template.

• Search for “section” in the elements panel (1).
• Click on the Section element to add it to the canvas (2).

• Click on the Container (1) in the Structure panel on the right.
• Click on the Elements button (2) to add a SureCart Element to the container.

• In the Container, select the Grid option (1) in the Display setting.
• In the Grid Template Columns, type repeat(4, 1fr) to create 4 columns (2).
• Add the Post Title element.

• Add a DIV element inside the container and click to select it (1).
• Click to add another element and search for “product” (2).
• Click on Product Card (3) to add it to the DIV.

• Click on the parent DIV again (1).
• Now, enable the Query Loop option (2).

• With the Query Loop enabled, click on the infinity button (1) to set the loop.

• In the Post Type, select SureCart Product (1).

Now, you just need to save your template and complete one final step to apply the Bricks layout to your collection.

• Go to Products > Collections menu (1).
• Select the collection where you want to apply the Bricks template and click Edit (2).

• In the Template section, click on the Default dropdown menu (1).
• Under Page Layout, click the dropdown and select SureCart Layout (2).
• Click the Save Collection button (3) to save the changes.

That’s it! Your collections will now use the Bricks template you’ve customized.

By following these steps, you’ve successfully applied your personalized design to your product collections, ensuring a cohesive and optimized shopping experience for your users. 

FAQ