How to Integrate ACF (Advanced Custom Fields) with Page Builder by SiteOrigin

Advanced Custom Fields and SiteOrigin’s Page Builder are one of the best WordPress plugins out there. By default, both plugins don’t have a clear connection on how they will integrate to each other. This is a good alternative¬†if you’re looking for ACF layout page builder. Flexible content on ACF Pro is a good choice too but it’s more complicated.

How to Integrate ACF and SiteOrigin Page Builder?

  1. The first step is to install both plugins.
  2. Create your usual custom field.
  3. Make a loop page template. This can be done by creating a file loop-[anytitle].php inside your active theme.
  4. Inside the loop template, add the ACF code for your custom field.
  5. Create a page and layout using the SiteOrigin page builder.
  6. Add a widget and choose “loop post”
  7. Pick the loop that you created from the drop down.
  8. Preview your work.

If you’re too lazy to follow my confusing instruction, you may watch the step by step video tutorial below: