

Every WordPress website eventually hits the same wall: the default editor is great for text and images, but terrible for structured content. How do you let a client or a colleague enter a product’s specifications, a testimonial’s author details, a team member’s photo and job title, or a service’s price and features — without breaking the design? Advanced Custom Fields (ACF) is the answer. It is the most popular custom fields plugin for WordPress, and in this complete ACF tutorial you will learn how to install it, create your first field group, choose the right field types, display values anywhere in your theme, and master advanced features like repeaters, options pages and ACF blocks — no matter whether you are a beginner or a seasoned site builder.
What Is Advanced Custom Fields (ACF)?
WordPress stores the main content of every post or page in a single content area. Anything extra — a price, a location, a product code, an extra image — has to go somewhere. WordPress offers “custom fields” for this, but the built-in interface is a raw key-value list that confuses most people. ACF turns those custom fields into beautiful, easy-to-use forms inside your edit screens.
As a website builder, you define exactly which fields appear on which content type. As an editor, you simply fill in labeled boxes like “Product price”, “Client logo”, or “FAQ answer”. The values are stored safely in the WordPress database and can be displayed anywhere in your theme with a few lines of PHP. This separation of content structure (defined by you) and content entry (done by anyone) is why ACF powers millions of business websites, from small company sites to large multilingual stores.
How to Install Advanced Custom Fields
- Go to Plugins → Add New Plugin in your WordPress dashboard.
- Search for “Advanced Custom Fields” and choose the plugin by WP Engine.
- Click Install Now, then Activate.
- A new ACF menu item appears in your admin sidebar. You are ready to build your first field group.
The free plugin is fully functional for this tutorial’s core workflow. The commercial ACF PRO adds premium field types (repeater, flexible content, gallery, clone), options pages, and ACF blocks — we will cover those in the advanced section, and they are clearly marked.
ACF Basics: Your First Field Group
Step 1 — Add a Field Group
Go to ACF → Field Groups → Add New. A field group is simply a container for fields. Give it a name that matches its purpose, for example “Product Details”.
Step 2 — Add Your First Fields
Click + Add Field. ACF asks you for the field’s Label (what editors see, e.g. “Price in USD”) and automatically suggests a Field Name (the technical key you will use in code, e.g. price_usd). Then choose a Field Type. The most useful types for business sites include:
- Text — short values like names, codes, or phone numbers.
- Text Area — longer paragraphs with optional formatting.
- WYSIWYG Editor — a full rich-text editor for formatted content blocks.
- Number — prices, quantities, years.
- Image — lets editors pick one image from the media library.
- Select / Checkbox / Radio — predefined choices, perfect for statuses or options.
- True / False — a simple on/off switch (“Show badge?”).
- Date Picker — clean date selection.
- Post Object / Relationship — link this content to another post or page.
Add as many fields as your content needs. Use the + Add Field button again for each new field, and drag fields to reorder them.
Step 3 — Set Location Rules
Scroll to the Settings box and find Location Rules. This is the magic of ACF: it decides where your fields appear. For example, set “Show this field group if Post type is equal to Product” — now the fields appear only when someone edits a product, keeping other screens clean. You can add multiple rules with “and / or” logic, and target posts, pages, taxonomies, or custom post types.
Other useful group settings: Position (show fields after the title, in the normal content area, or in a sidebar metabox), Style (default or seamless), and Show Fields on options like the block editor. Save the field group and open a matching post — your fields are waiting there, ready to be filled in.
Step 4 — Display the Values in Your Theme
Filling in fields is only half the job; now you must output the values. ACF stores data in the standard WordPress post meta table, and exposes two main template functions:
<?php
// Echo the value directly (prints it on the page):
the_field( 'price_usd' );
// Or fetch the value into a variable for further use:
$price = get_field( 'price_usd' );
if ( $price ) {
echo 'Price: $' . esc_html( $price );
}
?>Where do you put this code? In your theme’s template files, for example inside single.php, page.php, or a template part. If your site is built with a block theme or a page builder, read the “No-code display options” tip further below.
A common beginner mistake is expecting ACF to display fields automatically. It does not — ACF stores and manages the data, and your theme is responsible for printing it. Once you understand that mental model, everything else falls into place.
Advanced Custom Fields: Advanced Usage
Now that the basics are clear, let us explore the techniques that make ACF a genuinely powerful tool for content-heavy and client-friendly websites.
1. Conditional Logic — Smarter Forms
Every field can be shown or hidden based on the value of another field. Example: a True/False field “Add a special offer?” can reveal an extra group of offer fields only when switched on. Editors see a clean, focused form instead of a wall of boxes. Conditional logic is available on any field and works in both the free and PRO versions.
2. Repeater Fields (ACF PRO)
A repeater lets editors add an unlimited number of repeating rows. Typical use cases: price list rows, team member entries, gallery items with captions, or step-by-step instructions. Add a Repeater field, give it sub-fields (for example “Feature title” and “Feature description”), and let editors click “Add row” as often as they need.
To display a repeater in your template, loop over its rows:
<?php if ( have_rows( 'features' ) ) : ?>
<ul>
<?php while ( have_rows( 'features' ) ) : the_row(); ?>
<li><strong><?php the_sub_field( 'feature_title' ); ?></strong>
— <?php the_sub_field( 'feature_description' ); ?></li>
<?php endwhile; ?>
</ul>
<?php endif; ?>3. Flexible Content (ACF PRO)
Flexible Content is a repeater on steroids: instead of identical rows, editors build pages from a menu of layout blocks you define — “Text + image”, “Video”, “Call to action”, “FAQ accordion”. Editors click “Add Row”, choose a layout, fill its fields, and reorder the blocks freely. This is the engine behind many “page builder without a page builder” designs: the layout options are controlled by you, so the result always stays on-brand. In your template, check which layout each row uses with get_row_layout() and render the matching markup.
4. Options Pages (ACF PRO)
Sometimes data belongs to the whole site, not to a single post: contact details in the footer, social media links, opening hours, or global announcement banners. ACF PRO lets you register Options Pages — dedicated admin screens for global settings. Register one in your theme or a plugin:
<?php
if ( function_exists( 'acf_add_options_page' ) ) {
acf_add_options_page( array(
'page_title' => 'Site Settings',
'menu_title' => 'Site Settings',
'menu_slug' => 'site-settings',
'capability' => 'edit_posts',
) );
}
?>Then assign your “Site Settings” field group to the options page via its location rule, and read values anywhere with get_field( 'footer_phone', 'option' ). Updating a phone number in one place instantly updates every page that displays it.
5. ACF Blocks (ACF PRO)
ACF PRO integrates with the WordPress block editor: you can register your own Gutenberg blocks whose editable fields come straight from ACF. Register a block type, then build a field group and set its location rule to “Block”. Editors insert your custom block anywhere in the editor and fill its fields visually; you control the markup in a template file. This gives you the flexibility of a page builder with the performance and cleanliness of native WordPress blocks.
6. Local JSON — Keep Field Groups Under Version Control
ACF (free and PRO) can save every field group as a JSON file in your theme. Enable it by creating an acf-json folder in your theme directory — ACF will write each field group there automatically. The huge benefit: field definitions live with your code, can be committed to Git, and can be synchronized between environments (local, staging, production) with ACF’s built-in Sync screen. Never rebuild your fields by hand when moving a site again.
7. No-Code Display Options
Not a developer? You can still use ACF content without touching PHP:
- Elementor Pro and other page builders can pull ACF values into widgets through dynamic tags.
- Block themes can display custom fields inside the block editor with the help of the native “Post fields” or custom blocks.
- Small community plugins add shortcodes such as
for quick placements in classic content. - If you need many fields in many places, investing in a child theme with a few lines of template code is still the cleanest long-term solution — and it is a great first PHP project.
ACF Best Practices for SEO and Performance
Because ACF outputs plain HTML in your page source, search engines index your structured content normally — there is no JavaScript rendering to worry about. Use this to your advantage:
- Put SEO-critical text in real fields and headings. Product specifications, FAQs, and testimonials are perfect ACF content; search engines read them, and rich results (FAQ schema, product schema) can be mapped to them.
- Map key fields to structured data. Feed ACF values into JSON-LD schema (for example product price or review rating) so Google can display rich snippets.
- Keep an eye on database queries. A field group with dozens of fields is fine, but fetching many fields with individual
get_field()calls on archive pages can add queries. Cache rendered output or use object caching on high-traffic sites. - Use ACF where it adds value. For one-off pages, ordinary content is simpler. For repeatable, structured content across many posts — that is where ACF pays off.
Frequently Asked Questions
Is Advanced Custom Fields free?
Yes. The core plugin on WordPress.org is free and covers all the essentials: unlimited field groups, dozens of field types, location rules, conditional logic, and Local JSON. ACF PRO is a paid upgrade that adds repeaters, flexible content, galleries, options pages, and ACF blocks.
Do I need to know PHP to use ACF?
To define fields and let editors enter data — no. To display the values in classic themes — you need a little PHP (two or three template functions). Page builder users can often avoid code entirely through dynamic tags. Many beginners learn their first PHP exactly this way, with ACF as a friendly teacher.
Does ACF slow down my website?
ACF itself adds very little overhead; the values are plain post meta. Performance depends on how many fields you fetch per page. Sensible field design, a caching plugin, and avoiding excessive meta queries on archive pages keep everything fast.
Is ACF content included in search engines?
Yes. ACF values are rendered as normal HTML on the server, so Google and other engines index them like any other content. That is one of the main SEO advantages over JavaScript-rendered page builders.
Can I move a site with ACF fields to another server?
Yes. Use ACF Local JSON so field definitions travel with your theme files, and export/import the content (posts and their meta) with a migration plugin or WordPress’s own export tools. ACF also has built-in tools to export and import field groups between sites.
Conclusion
Advanced Custom Fields transforms WordPress from a blogging tool into a professional content management system. In this ACF tutorial you learned the complete workflow: installing the plugin, creating field groups with location rules, choosing the right field types, and displaying values with the_field() and get_field(). You also explored the advanced features that scale with your ambition — conditional logic, repeaters and flexible content for dynamic layouts, options pages for global settings, ACF blocks for the block editor, and Local JSON for clean development workflows — plus the SEO and performance habits that keep ACF sites fast and indexable.
Start small: add one field group to one post type, display two fields in your theme, and grow from there. Within an afternoon you will wonder how you ever managed structured content without it. And if you would rather have an experienced team plan and build your ACF-powered website while you focus on your business, you can learn more about professional WordPress development and operations services at yunying.feeding-engineer.com — from custom fields architecture to complete site builds.












2 thoughts on “Advanced Custom Fields (ACF) Tutorial: The Complete Guide for WordPress (2026)”