[Tip] Rendering Beaver Builder Layouts on Archive Templates

Page builders. They’re all over the place and if you build sites for clients then you’ve at least given some “side-eye” at the solutions that are out there. The most polished and refined is clearly Beaver Builder.

I’ve used Beaver Builder on a few projects now. I like its ease of use. However, what I like most is that my clients feel empowered to make changes to their site and they really feel like they can go in and mostly do what they want. That’s great! I had one client go berzerk and make some seriously neat layouts using Beaver Builder!

I had a recent project where a client wanted more control over the archive layouts for their site. I was rendering them using standard WordPress template conventions. Meaning that I was simply creating an archive-{post-type}.php template file and calling a template part to render content.

The client wanted more. They changed their mind on the design and wanted a different layout for their archives page for a particular post type. Sometimes people change their minds and that’s okay. We were already using Beaver Builder on a couple portions of the site so I was wondering how we might use it to work on the template archive page. It turns out the solution wasn’t all that difficult.

The First Step

Create your archive template file like so: archive-{your-post-type-slug}.php. In my case, it was named archive-location.php

Rendering a Beaver Builder Layout in PHP

Beaver Builder provides a method to easily call templates you’ve made with their plugin via ‘FLBuilder::render_query. It accepts many of the same parameters as WP_Query. Below is what I used.

‘p’ is the ID of your Beaver Builder template that you wish to render in your template file and ‘post_type’ just calls the post type used by the BB templates.

My Template File

Making it easy to manage

The other part to this is providing a method for the client to easily manage their Beaver Builder layouts. Beaver Builder provides this functionality!

In Beaver Builder you have to enable the template admin option, which can be set from: Settings > Page Builder > Templates.

The solution is pretty simple and provides an interface for a client to modify the layout as they wish. I do like page builders, but I think relying on them actually costs you more development time than just creating the page templates from scratch. Just my opinion.