acf繰り返しフィールドの利用例

情報を追記している場合はありますが、古い情報を訂正はしていませんので、公開年月日を参照してください。プラグイン・タグ、いずれもワードプレス・PHPのバージョン等によって動作しない場合もあります。

Advanced Custom Fields の繰り返しフィールドを使って、投稿に
見出し画像または見出しテキストと本文のセット、
スライド、
横分割コンテンツ(2~4分割で見出しと本文、横幅は合計100になるように数字を入力)
リンクバナー(1~3つ、画像とリンク先、横幅を設定)
を好きなだけ入れられるようにした例。

<?php if(have_rows('content')) { ?>
<?php $countc = 1; while(have_rows('content')): the_row(); ?><section>
 	<?php if(get_sub_field('image') ){ ?><?php $attachment_id = get_sub_field('image');$size = 'full'; $image = wp_get_attachment_image_src( $attachment_id, $size ); ?><h3><img src="<?php echo $image[0]; ?>" width="<?php echo $image[1]; ?>" height="<?php echo $image[2]; ?>" alt="<?php the_sub_field('alt'); ?>" /></h3><?php } elseif (get_sub_field('alt')) { ?><h3 class="txt"><span><?php the_sub_field('alt'); ?></span></h3><?php } ?>

<div class="entry clearfix">
	<?php the_sub_field('txt'); ?>

	<?php if(have_rows('slides')) { ?>
	<script type="text/javascript">
	  $(document).ready(function(){
	$('.contentslides-<?php echo $countc; ?>').bxSlider({
	  auto: true,
	  adaptiveHeight: true,
	  speed:2000,
	  pause:2000,
	  pager: false,
	  controls:false
	});
	  });
	</script>
<ul class="contentslides-<?php echo $countc; ?>">
	<?php while(have_rows('slides')): the_row(); ?><li><?php if(get_sub_field('slideimage') ){ ?><?php $attachment_id = get_sub_field('slideimage');$size = 'full'; $image = wp_get_attachment_image_src( $attachment_id, $size ); ?><img src="<?php echo $image[0]; ?>" width="<?php echo $image[1]; ?>" height="<?php echo $image[2]; ?>" alt="<?php the_sub_field('alt'); ?>" /><?php } ?></li>
	<?php endwhile; ?></ul><?php } ?>

	<?php if(get_sub_field('4blocks')) { ?>
	<div class="ftopics" class="clearfix">
	<?php if (get_sub_field('h2title')) { ?><h2><?php the_sub_field('h2title'); ?></h2><?php } ?>
	<?php if(have_rows('fblock')) { ?><ul class="clearfix">
	<?php while(have_rows('fblock')): the_row(); ?><li class="out"<?php if (get_sub_field('width')) { echo ' style="width:'; the_sub_field('width'); echo '%;"'; } ?>>
	<div class="in">
	<?php if (get_sub_field('title')) { ?><h3><?php the_sub_field('title'); ?></h3><?php } ?>
	<?php the_sub_field('text'); ?>
	</div></li><?php endwhile; ?></ul><?php } ?></div>
	<?php } ?>

	<?php if(have_rows('link')) { ?><ul class="contentnavi">
	<?php $count = 1; while(have_rows('link')): the_row(); ?>
	<li class="<?php if($count==1){ echo 'fst'; } ?><?php if(!get_sub_field('banner') ){ echo ' txtlink'; } ?>" style="width:<?php the_sub_field('width'); ?>%;"><a <?php if (get_sub_field('ext')) { ?>href="<?php the_sub_field('ext'); ?>" target="_blank"<?php } else { ?>href="<?php echo esc_url( home_url( '/' ) ); ?><?php the_sub_field('url'); ?>"<?php } ?>><?php if(get_sub_field('banner') ){ ?><?php $attachment_id = get_sub_field('banner');$size = 'large'; $image = wp_get_attachment_image_src( $attachment_id, $size ); ?><img src="<?php echo $image[0]; ?>" width="<?php echo $image[1]; ?>" height="<?php echo $image[2]; ?>" alt="<?php the_sub_field('alt'); ?>"><?php } else { ?><?php the_sub_field('alt'); ?><?php } ?></a></li>
	<?php $count++; endwhile; ?></ul><?php } ?>

</div></section>
	<?php $countc++; endwhile; } ?>

2021.6追記
入れるコンテンツを自由に選択して、簡単に投稿できるようにという希望で作成したもの。こういう要望はめったにありませんが。
*フレキシブルよりもリピーターの方がわかりやすい画面にできたので。

その他のAdvanced Custom Fields に関する記事一覧

Advanced Custom Fields に関する記事一覧ページへ