Wow, that post title is a mouthful.
Anyway, I recently worked on a new design for a clients WooCommerce site and came across a little issue with displaying Advanced Custom Fields (ACF) in the product categories. I wanted the client to have control over what child categories to display on the parent category pages instead of just blindly showing them all. So to do this I used the repeater field addon to create the fields I needed to allow the client to upload a photo, category title and link to that specific child category and display it all nice and visually like the below screenshot.
1. Create your repeater fields
So to begin with I crreated my repeater fields in ACF settings. Below is a screenshot of my setup.
2. Editing your product category template file
Copy the product category template file from /plugins/woocommerce/archive-product.php to your theme folder /themes/yourtheme/woocommerce/archive-product.php and then add the following code just under “do_action( ‘woocommerce_archive_description’ );”
<?php
// vars
$queried_object = get_queried_object();
$taxonomy = $queried_object->taxonomy;
$term_id = $queried_object->term_id;
$GLOBALS['wp_embed']->post_ID = $taxonomy . '_' . $term_id;
/*
* Loop through a Repeater field
*/
if( get_field('sub_categories', $taxonomy.'_'.$term_id) ): ?>
<div class="featcats">
<?php while( has_sub_field('sub_categories', $taxonomy.'_'.$term_id) ): ?>
<div class="featcat">
<a href="<?php the_sub_field('select_product_category'); ?>">
<div class="catimage"><img src="<?php the_sub_field('image_upload'); ?>" /></div>
<h3>
<?php the_sub_field('title_of_category'); ?>
</h3>
</a>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
Obviously change the custom field and div names to your own custom fields and style as you please but that is the general code to use.
So thats it. Hopefully that will help you to make things easier for your clients to achieve what they want.