ACF Custom Fields

Advanced Custom Fields (ACF) is the most widely used custom fields plugin for WordPress. Protuno integrates with it in two ways: dynamic tags for binding ACF values to standard Elementor widget controls, and Twig expressions for outputting ACF values anywhere in a Proton widget's HTML.

ACF Dynamic Tags

Dynamic tags let you bind an ACF field value to any Elementor widget control that accepts dynamic data, headings, text editors, image controls, URL fields. No code required.

Where Dynamic Tags Appear

In the Elementor panel, look for the dynamic tag icon (a small lightning bolt or link icon) on any field that supports dynamic data. Click it and choose from the ACF group.

The 4 ACF Dynamic Tags

Source Option

The ACF Field and ACF URL tags have a Source setting:

ACF Field: Supported Field Types

The ACF Field tag supports: text, textarea, number, email, url, password, wysiwyg, select, checkbox, radio, button_group, true_false, range, date_picker, date_time_picker, time_picker, color_picker

For checkbox and multi-select fields that return arrays, the tag joins the selected values with a comma.

ACF Gallery: Image Index

The ACF Gallery tag includes an Image Index setting (default: 0). Set it to 0 for the first image, 1 for the second, and so on.

ACF Fields In Twig

Inside a Proton widget's HTML panel (Developer Mode), you can output ACF field values using post.meta():

{{ post.meta('field_name') }}

Replace field_name with the ACF field name (the name you set when creating the field, not the field key like field_abc123).

Text And Simple Fields

<p class="product-tagline">{{ post.meta('tagline') }}</p>
<span class="price">{{ post.meta('custom_price') }}</span>
<a href="{{ post.meta('external_link') }}">Learn More</a>

Conditional Output

{% if post.meta('show_badge') %}
  <span class="badge">{{ post.meta('badge_text') }}</span>
{% endif %}

{% if post.meta('discount_percent') %}
  <span class="discount">{{ post.meta('discount_percent') }}% Off</span>
{% endif %}

Author Fields

For user-attached ACF fields, chain to the author object:

{{ post.author.meta('certifications') }}
{{ post.author.meta('linkedin_url') }}

Image Fields

ACF image fields return an array (or an ID, depending on the Return Format setting). Use post.meta() to get the ID and then reference the attachment:

{# If Return Format is set to ID #}
{% set headshot_id = post.meta('author_headshot') %}
{% if headshot_id %}
  <img src="{{ headshot_id|wp_image_src('medium') }}" alt="{{ post.author.name }}">
{% endif %}

{# If Return Format is set to URL (simplest) #}
<img src="{{ post.meta('author_headshot_url') }}" alt="{{ post.author.name }}">

For simpler image binding in Elementor, use the ACF Image dynamic tag instead.

Repeater And Complex Fields

For ACF repeater fields, the raw post.meta() call returns the PHP array structure. Use this in Twig with a for loop:

{% for row in post.meta('team_members') %}
  <div class="team-card">
    <h3>{{ row.name }}</h3>
    <p>{{ row.role }}</p>
  </div>
{% endfor %}

For complex nested ACF structures (flexible content, relational fields), the dynamic tag approach is usually simpler.

Frequently Asked Questions

Does Protuno work with ACF Free or only ACF Pro? Both. The dynamic tags and Twig integration work with ACF Free. Pro-only field types (repeater, flexible content, options pages) are accessible via post.meta() in Twig but may have complex data structures.

Can I use ACF options page values? Options page fields are stored as user/option meta, not post meta. Use site.option('field_key') in Twig for options page fields, or access them via the ACF PHP API in a custom code block.

The ACF field dropdown is empty in the dynamic tag settings. This means either ACF is not active, or there are no field groups registered for the current post type. Check that your ACF field group is assigned to the correct post type in the ACF field group settings.

Related

• Dynamic Content Overview
• Dynamic Data With Twig
• Dynamic Tags: Bind Content Without Code
• WooCommerce Product Data