I had an opportunity to work with Beaver Builder for quite a long time. This is a plugin that helps you build content for the website, which is recommended by many influencers, including Chris Lema and Pippin Williamson.

A Brief Introduction To Beaver Builder

Beaver Builder is easy to use and quite simple. I mean it’s simple to use. Its has all features you need. However, to build a website completely with Beaver Builder, you would need to add an addon, Beaver Themer. This is the tool that Beaver Builder beats other competitors.

Beaver Themer helps you create layout for pages in WordPress. If the page builders just let you create content, and the sections like header, footer or layout of single post, archive page you have to code yourself in your theme, then Beaver Themer help you do that extremely easily.

To build the layout, Beaver Themer has an important feature field connection, which allows to connect the data in WordPress to the elements in the page builder. For example, if you want the heading to display the post title, you will need to connect the heading element to the post title. Or, if you want the header have the background image of the featured image of the post, then just connect the background image with the featured image of the post.

In addition to the types of data available in WordPress (such as post title, featured image), another important type of data is custom fields. How to display custom fields in Beaver Themer layout? For example, you have a custom post type book, which has custom fields author and year of publication, how to display these information in a single book page?

And that’s why I created a free extension to connect between custom fields created by Meta Box and Beaver Themer.

Connect Custom Fields With Beaver Themer via Meta Box – Beaver Themer Integrator

As you know, Meta Box helps you create custom fields quickly and easily. And to display these custom fields in a layout built by Beaver Themer, you have two options:

For simple text fields, Beaver Themer already supports the ability to connect to the Post Custom Field. See the picture below:

post custom field

And you just enter the key of the custom field (meta key) to display its value.

However, this feature has two disadvantages:

  • You must remember the key of the custom field and enter it manually. Sometimes it makes you have to revisit the code to know what the key is. Very annoying for beginners.
  • This method does not work with complex fields, such as image gallery (field image_advanced).

To solve these problems, you need to install the extension Meta Box – Beaver Themer Integrator. This extension is a free plugin that shows you the custom fields from Meta Box in Beaver Builder layout. It handles all field types and does not require you to remember field names.

Here are some pictures of this extension:

One great thing about using Beaver Builder is that you’ll be joining a great community. When I introduced this extension to the Beaver Builder community on Facebook, I received a lot of good comments. Even so, David McCan made a demo video for this extension:

I am very thankful to the community and especially to David McCan.

This extension works well with Meta Box field types. It even works with the extension MB Custom Table, which saves your custom fields to a custom table instead of the post meta. I’m currently working on how to improve it to display the values ​​of the groups, and if so, there will be a new version.

The plugin is free and is available on wordpress.org. I hope you like it. Let me know what you think in the comments. And if you’re wondering about a page builder plugin, I recommend using Beaver Builder. That’s a good choice.


Also published on Medium.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.