How to Use ACF (Advanced Custom Fields) with Elementor Pro (Complete Dynamic Content Guide)

Building scalable, dynamic websites in WordPress requires separating design architecture from content management. When building custom real estate portals, directory listings, automotive inventories, or case studies, hardcoding every single page in Elementor is unsustainable. Combining Advanced Custom Fields (ACF) with Elementor Pro’s Dynamic Tags allows you to build a single master template that automatically renders bespoke data for thousands of individual posts.

At CV World, dynamic custom architecture is the backbone of our web development practice. In this complete developer guide, we walk you through the entire workflow of pairing ACF and Elementor Pro in 2026, including handling complex fields like Repeaters, Galleries, and relationship queries.

1. Step 1: Planning Custom Post Types (CPT) and Custom Fields

Before touching Elementor, define your data model in WordPress. Using either the free Custom Post Type UI (CPT UI) or ACF’s built-in post type manager (ACF 6.1+):

1. Navigate to ACF → Post Types → Add New.
2. Create a new post type, for example: Properties (Plural) and Property (Singular).
3. Set supported features: Title, Editor, Featured Image, and Custom Fields.
4. Click Save Changes.

2. Step 2: Creating the ACF Field Group

Now, create structured meta inputs for your content editors:

1. Go to ACF → Field Groups → Add New and name it Property Specifications.
2. Add your specific fields:
   • Property Price: Field Type = Number / Text (Field Name: property_price).
   • Square Footage: Field Type = Number (Field Name: property_sqft).
   • Bedrooms / Bathrooms: Field Type = Select or Number.
   • Floor Plan PDF: Field Type = File (Field Name: floor_plan_pdf).
   • Virtual Tour URL: Field Type = URL or oEmbed.
3. In the Location Rules box, set: Show this field group if Post Type is equal to Property.
4. Click Save Changes.

3. Step 3: Designing the Single Post Template in Elementor Theme Builder

With custom fields configured and populated on a test post, create your dynamic layout:

1. In WordPress Admin, navigate to Templates → Theme Builder → Single Post → Add New.
2. Click the Gear icon at bottom left (Settings → Preview Settings) and set Preview Dynamic Content as Property. Select your test property to view live data while designing.
3. Add a Heading Widget for the property title. In the Content tab, click the Dynamic Tags database cylinder icon → select Post Title.
4. Add another Heading Widget for the price:
   • Click Dynamic Tags → Scroll to ACF → ACF Field.
   • Click the wrench icon next to ACF Field and choose property_price from the dropdown.
   • In the Advanced sub-tab of the dynamic tag, add a prefix (e.g., $ or ₹) and comma formatting.

4. Advanced: Displaying ACF Image & Gallery Fields

To display an ACF Image field:

• Drag an Image Widget onto your canvas.
• Hover over the image preview box and click the Dynamic Tags icon.
• Select ACF Image Field and choose your field key (e.g., property_hero_photo).
• Elementor automatically pulls the URL and renders it with responsive srcset attributes.

5. Dynamic Visibility and Conditional Display

Not every post will have every field filled out. Elementor Pro allows you to prevent empty containers from displaying:

• Click the Container or Widget containing the custom field.
• In the Advanced tab, configure Display Conditions (or use the built-in Hide if empty option in Dynamic Tags).
• This ensures your layout remains clean even if certain properties omit a video tour or floor plan.

6. Common ACF + Elementor Troubleshooting

Need a custom dynamic web application, property listing engine, or directory platform built on WordPress? Check out our custom WordPress development services at CV World.

ACF Repeater & Relationship Fields: Advanced Architecture

When structuring high-end dynamic directories or portfolio projects, simple text fields are rarely enough. Managing ACF Repeater Fields (for multi-row lists such as team members or pricing feature tables) and Relationship Fields (linking articles to specific case studies) turns WordPress into a headless-grade relational database.

By coupling ACF Relationship fields with Elementor’s Loop Grid, you can build self-updating cross-reference blocks that automatically showcase products designed by a specific author or properties managed by a specific agent without manual data entry.

Frequently Asked Questions