手必看：如何使用 ACF 创建 WordPress 自定义字段，实现内容自由化

2025-10-23
9:06 上午
高级教程

在 WordPress 的世界里，自定义字段（Custom Fields） 是让网站从“模板化”走向“定制化”的关键一步。而在所有可用工具中，Advanced Custom Fields（简称 ACF） 无疑是最强大也最易用的插件之一。通过它，你可以轻松为文章、页面、产品或自定义文章类型添加任意字段，让内容结构化展示变得更灵活。本文将从零开始带你了解如何使用 ACF 创建自定义字段，实现真正意义上的“内容自由编辑”。

一、什么是自定义字段（Custom Fields）？

在 WordPress 中，每篇文章都可以包含“标题”、“正文”、“特色图片”等默认字段。但在很多场景下，我们需要更多信息：

在作品集网站中添加“项目链接”、“客户名称”、“完成时间”；
在产品展示页中添加“产品参数”、“技术规格”、“下载链接”；
在博客中为作者添加“社交媒体链接”或“推荐阅读”。

这时，自定义字段就派上用场了。而 ACF 插件正是管理这些字段的利器。

二、为什么选择 Advanced Custom Fields（ACF）？

ACF 由 Eliot Condon 开发，是全球最受欢迎的自定义字段插件之一。
它的优势包括：

✅ 界面友好 —— 不需要写代码就能创建和管理字段组。
✅ 字段类型丰富 —— 支持文本、图片、文件、关系、重复器（Repeater）、灵活内容（Flexible Content）等多种字段。
✅ 完美兼容 —— 支持文章、页面、自定义文章类型、用户资料、菜单项、选项页等。
✅ 开发者友好 —— 提供强大的函数和钩子，让字段数据可直接调用到模板中。

三、安装与启用 ACF 插件

1️⃣ 登录你的 WordPress 管理后台
2️⃣ 点击左侧菜单 插件 → 安装插件
3️⃣ 搜索 “Advanced Custom Fields”
4️⃣ 点击 安装 → 启用

👉 如果你需要更高级的功能（例如 Repeater、Flexible Content），可以考虑购买 ACF Pro 版本。

四、创建自定义字段组（Field Group）

安装完成后，开始创建第一个字段组：

1️⃣ 在后台菜单找到 “自定义字段” → “添加新”
2️⃣ 为字段组取一个名字（例如“产品信息”）
3️⃣ 点击 “添加字段” 按钮，开始创建你的字段：

字段标签：例如“产品型号”
字段名称：自动生成，如 product_model
字段类型：选择“文本”或“选择框”等
4️⃣ 你可以继续添加多个字段，如“价格”、“产品图片”、“下载链接”等。
5️⃣ 在下方的 “显示规则” 设置中，选择该字段组要应用的位置，比如：
文章类型等于 “产品”
页面等于 “联系我们”

6️⃣ 点击 “发布” 保存字段组。

五、在前端模板中显示自定义字段

创建完字段后，我们需要在主题模板中调用这些数据。例如，如果字段名称是 product_model，可以在主题文件（如 single-product.php）中使用以下代码：

<?php 
// 获取并显示自定义字段的值
$product_model = get_field('product_model');
if( $product_model ) {
    echo '<p><strong>产品型号：</strong>' . esc_html($product_model) . '</p>';
}
?>

如果你使用 Elementor Pro、Bricks Builder 或 Oxygen 等现代可视化编辑器，也可以通过动态标签（Dynamic Tags）直接调用 ACF 字段，无需手写代码。

六、进阶用法：Repeater 与 Flexible Content

💡 Repeater（重复器字段）

当一个字段可能会重复出现时（如多张产品图片、多条参数列表），Repeater 字段可以帮助你创建循环数据。例如：

<?php if( have_rows('product_specs') ): ?>
    <ul>
        <?php while( have_rows('product_specs') ): the_row(); ?>
            <li><?php the_sub_field('spec_name'); ?>：<?php the_sub_field('spec_value'); ?></li>
        <?php endwhile; ?>
    </ul>
<?php endif; ?>

💡 Flexible Content（灵活内容）

这是一种“可视化版模板构建器”，允许用户自由组合不同内容块。非常适合自定义页面构建或模块化布局。

七、结合 ACF 创建“选项页”（Options Page）

ACF Pro 支持创建站点级的“选项页”，用于保存全局设置，如网站联系信息、社交媒体链接、页脚版权文字等：

if( function_exists('acf_add_options_page') ) {
    acf_add_options_page(array(
        'page_title' => '网站设置',
        'menu_title' => '网站设置',
        'menu_slug'  => 'theme-settings',
        'capability' => 'edit_posts',
        'redirect'   => false
    ));
}

然后就可以通过 get_field('phone', 'option') 获取全站统一的电话字段。