Updated on 15 Apr 2024
In the Bricks Facebook group a user asks:
Archive Template Layout based on ACF Value
Hi guys, do you have an idea how set up the following scenario:
I want to use Bricks in combination with ACF Pro.
Based on an ACF value which you can change on an Options Page created with ACF Pro, I want to change the used Archive Template for my blog posts.
E.g. Today, I choose Option 1 and all blog archives are black. Tomorrow I choose Option 2 and everything is white…
I just can't figure out how to set a bricks template condition for that scenario that it will take the ACF field into consideration.
What I want to prevent is to have all different layouts in one Bricks Template and only show the respective one (based on the setting) and hide all the others?
This Pro tutorial for Bricks users provides the steps to apply a template chosen in ACF Pro's options page to the blog posts index page, also known as the Posts page using bricks/active_templates filter.
example.com/blog:
With
for example,
While this tutorial is written for ACF Pro, it should also work when using other custom fields plugins like Meta Box with minor changes. If you need any help or guidance with this, please leave a comment.
Step 1
Create a Page titled "Blog" or "News".
Set it as the Post page at Settings → Reading.
Step 2
At Bricks → Templates, create two templates of the type "Archive".
Edit each with Bricks and add your desired elements like a heading text and Posts element or a query loop.
Do not apply template conditions.
Step 3
Install and activate ACF Pro.
Go to ACF → Options Pages and create a new Options page.
Step 4
Create a corresponding field group.
Field type: Button Group
Field label: Blog Posts Index Layout
Field Name: blog_posts_index_layout
Choices:
273 : Layout 1
274 : Layout 2
Replace 273 with the ID of your Layout 1 template and 274 with that of your Layout 2 template.
Step 5
Click on "Site Settings" in the admin menu, select your desired layout and click Save/Update.
Step 6
Add the following in child theme's functions.php (omit the beginning PHP tag if going this route) or a code snippets plugin:
