Advanced Custom Fields插件可以帮助你快速创建和管理custom fields,当你成功存储了数据后,该如何在网站前台显示它们呢?本文列举了来自ACF官方文档的代码实例,帮助你了解如何使用ACF创建内容丰富的网页。使用模版函数需要修改模版,ACF也提供了shortcode方式,不需修改模版依然能使用其数据。

模版函数

显示一个字段

field_name代表字段名称,指创建custom field时“Field Name”中填写的内容,只能输入字母和下划线。

<p><?php the_field('field_name'); ?></p>

the_field()的使用类似WordPress的the_title(),直接输出内容。

返回字段的值

the_field()会直接显示字段的值,要返回的话,就要用get的方式

<?php
 
$variable = get_field('field_name');
 
// 现在可以使用$variable了
 
?>

使用前判断值是否存在

如果(value == “” || value == null || value == false),则get_field()返回false,这样就可以先判断值是否存在,再输出

<?php
 
if(get_field('field_name'))
{
	echo '<p>' . get_field('field_name') . '</p>';
}
 
?>

处理数组类型的返回值

ACF中image、file等类型可以用数组形式(如选择image object)返回更多的数据,而不仅仅是只返回image url或者file url。

下面的代码演示先用get_field()获取数组,在用foreach循环读取数组元素的方法。

<?php
 
$values = get_field('field_name');
if($values)
{
	echo '<ul>';
 
	foreach($values as $value)
	{
		echo '<li>' . $value . '</li>';
	}
 
	echo '</ul>';
}
 
// 用var_dump()看一看$values的真面目吧
var_dump($values);
 
?>

处理返回url的image类型

如果创建image type时选择返回url,代表返回值是一个字符串,所以显示方法如下

<img src="<?php the_field('image_test'); ?>" alt="" />

处理返回ID的image类型

如果创建image type时选择返回image ID,则返回值会是一个整数,我们当然不想显示整数,要根据这个ID获取更多信息。

<?php $image = wp_get_attachment_image_src(get_field('image_test'), 'full'); ?>
<img src="<?php echo $image[0]; ?>" alt="<?php echo get_the_title(get_field('image_test')) ?>" />

获取Repeater Field的值

Repeater Field是ACF的付费组件,repeater field的值可以由 get_field、 the_repeater_field /the_sub_field获取

<?php 
 
// 方法一:直接使用数组方式操作,$rows是一个数组
 
$rows = get_field('repeater_field_name');
if($rows)
{
	echo '<ul>';
 
	foreach($rows as $row)
	{
		echo '<li>sub_field_1 = ' . $row['sub_field_1'] . ', sub_field_2 = ' . $row['sub_field_2'] .', etc</li>';
	}
 
	echo '</ul>';
}
 
// 方法二:使用has_sub_field + get_sub_field的组合获取
 
if(get_field('repeater_field_name'))
{
	echo '<ul>';
 
	while(has_sub_field('repeater_field_name'))
	{
		echo '<li>sub_field_1 = ' . get_sub_field('sub_field_1') . ', sub_field_2 = ' . get_sub_field('sub_field_2') .', etc</li>';
	}
 
	echo '</ul>';
}
 
//方法三:使用the_repeater_field + the_sub_field的组合获取
if(get_field('repeater_field_name')): ?>
 
	<ul>
 
	<?php while(has_sub_field('repeater_field_name')): ?>
 
		<li>sub_field_1 = <?php the_sub_field('sub_field_1'); ?>, sub_field_2 = <?php the_sub_field('sub_field_2'); ?>, etc</li>
 
	<?php endwhile; ?>
 
	</ul>
 
<?php endif; ?>

随机获取repeater fleid中的一个元素

<?php
 
$rows = get_field('repeater_field_name');
$row_count = count($rows);
$i = rand(0, $row_count - 1);
 
echo $rows[$i]['sub_field_name'];
 
?>

从非当前页面获取数据

<?php
 //要获取数据的页面的post ID
$other_page = 12; 
 
//直接显示内容
?>
<p><?php the_field('field_name', $other_page); ?></p>

<?php
//不直接显示,先将值赋给一个变量
// get variable
$variable = get_field('field_name', $other_page);
 
// 以repeater类型为例  -注意 the_sub_field和get_sub_field函数不需要post ID参数
if(get_field('repeater_field_name', $other_page))
{
	echo '<ul>';
 
	while(has_sub_field('repeater_field_name', $other_page))
	{
		echo '<li>sub_field_1 = ' . get_sub_field('sub_field_1') . ', sub_field_2 = ' . get_sub_field('sub_field_2') .', etc</li>';
	}
 
	echo '</ul>';
}
 
?>

使用ACF的值查询数据

本质是根据custom field的值查询post。

<?php
 
$posts = get_posts(array(
	'numberposts' => -1,
	'post_type' => 'event',
	'meta_key' => 'location', //acf中定义
	'meta_value' => 'melbourne'
));
 
if($posts)
{
	echo '<ul>';
 
	foreach($posts as $post)
	{
		echo '<li><a href="' . get_permalink($post->ID) . '">' . get_the_title($post->ID) . '</a></li>';
	}
 
	echo '</ul>';
}
 
?>

Shortcode方式

[acf field="field_name"]

使用这个shortcode,就可以直接在所见即所得编辑器中使用ACF的值,不过有一些局限性:

  • 只能获取当前文章的ACF内容
  • 对repeater field不适用

使用例子

This is a story about a boy named [acf field="name"]. He is [acf field="age"] years old.

参考文档

ACF Code Examples

ACF Shortcodes

16条留言

  1. solagirl,预祝愉快。是这样,我使用pro版的。repeater的名称为:homenew ,sub_field我使用的是post_object。我想输出post_object的标题,固定连接等;我写的是:

    <a href="”>

    字段规则是应对首页的,我想在首页输出几个指定的文章。我知道还有别的方法,关键是我还需要列出文章字段的信息,所以,麻烦您就告诉如何通过文章对象输出title就可以了。其他的我可以自己琢磨。谢谢了。

    1. 代码:
      <?php if(have_rows(‘homenew’)):while(have_rows(‘homenew’)):the_row();//外层循环
      $postinfo=get_sub_field(‘homenewpost’);setup_postdata(‘$postinfo’);//setup_postdata我是看官方文档,大概理解成格式化处理吧。?>
      <h3><a href=”<?php the_permalink();?>”><?php the_title();?></a></h3>
      <?php wp_reset_postdata();//官方文档说这个必须要endwhile;endif;?>

      补充,出现的循环,并没有列出文章的标题,而是把首页的标题列出来了。求问原因在哪里?

      1. 我没有使用官方文档的,我是自己输出对象的值可以,求问solagirl我按照官方文档的做没有成功。错在哪了?

      2. repeater field是针对一个post,而setup_postdata是用在WordPress WP_Query循环中的,理应WP_Query循环为外层,repeater field循环在内层,你的顺序正好反着。

        如果你不理解这俩循环的区别,建议使用更直观的方式,官方文档http://www.advancedcustomfields.com/resources/repeater/中Basic Loop (PHP foreach loop)这一段的代码可以参考,你直接用get_field获取repeater字段的内容,打印一下就明白这个repeater field到底存了哪些数据,是怎么存的。获取文章其它信息都用带着post id的函数,就不会出错了。比如获取文章标题,用get_the_title( $post_id )这种

  2. sola好,我用advanced custom field pro (上次你给我的pro版,再次感谢) ,在页面增加了字段然后保存页面后,内容莫名其妙的就没了,又要重新保存,请问是什么情况下会这样呢

  3. 博主你好,希望你能及时看到,我现在使用repeat与gallery一起,gallery是repeat的sub field,可是我前台调用只能调用到repeat,gallery不显示

  4. Hi Sola,
    我使用<i-mg src="” alt=”” />这样的方式输出自定义的图像,后台(这个插件)自定义字段(image_test)配置中”预览图大小”我选择中或者我自定义的其它几个裁剪图片尺寸,前台输出的图像始终是图片原始图,后台文章中预览图大小正常,希望得到你的帮助
    谢谢!

    1. image字段可以选返回值类型,你选择返回image object,这个包含所有尺寸图片的地址,用var_dump看一下返回值结构即明了。
      也可以参考官方文档http://www.advancedcustomfields.com/resources/field-types/image/
      看Customized display (Object)一节里的数组结构

  5. 博主好,希望请教一个问题,我设置了一个文本类型的字段用来处理链接。例如field name是post_url,内容是http://url,在php中调用<a href="”>TEXT</a>,但尝试后不成功。网页会显示到标签之前,不知道该如何修改。

    1. 评论中的代码被过滤掉了,所以你说的问题我不太明白,你是说acf调用出错吧。我用这个插件没出过问题,建议你用全新wordpress+默认主题测试。

      1. 简单的说,我定义了一个名为url的文本类型字段,内容填写的是一个完整网址,然后在PHP里调用出来作为a标签的href属性,想以此产生一个超链接(比如转载文章时,用来加原文链接),就是这个不成功,其他都成功的,实际页面的HTML会显示到a标签之前的内容。我用的就是3.6+2012主题。

        1. 文本类型下面应该有个设置控制输出html还是纯文本,选择纯文本。
          然后用var_dump()函数输出一下你的字段,看看输出的字符串到底是不是你想要的。
          看不到代码我也不知道到底什么问题,能想到的可能就是是本该传递给变量的值被直接输出了。

          1. 赞美~问题解决了。就是转成HTML的问题。

评论功能已关闭