Display ACF custom field right after the product title in WooCommerce content widget

Question

I would like to display a custom field generated with ACF under the product title in WooCommerce widget for recently viewed products.

I already achieved to echo the custom field in the widget but it shows depending on the action hook either above the product picture with woocommerce_widget_product_item_start or under the price and delivery info with woocommerce_widget_product_item_end.

I used the following code snippet in my functions.php

add_action( 'woocommerce_widget_product_item_start', 'acf_field_woo', 6 );
    global $product;
function acf_field_woo() { 
   echo '<p class="wc-subtitle">' . get_field('subtitle') . '<br /></p>';
}

With this it's shown above the product image in the widget. So far so good, but

how can I achieve to show it directly under the product title in the widget?

Answer 1

To display your ACF field directly below the product title, you will need to edit the template file. As can be found in templates/content-widget-product.php

• This template can be overridden by copying it to yourtheme/woocommerce/content-widget-product.php

So replace

<a href="<?php echo esc_url( $product->get_permalink() ); ?>">
    <?php echo $product->get_image(); // PHPCS:Ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
    <span class="product-title"><?php echo wp_kses_post( $product->get_name() ); ?></span>
</a>

With

<a href="<?php echo esc_url( $product->get_permalink() ); ?>">
    <?php echo $product->get_image(); // PHPCS:Ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
    <span class="product-title"><?php echo wp_kses_post( $product->get_name() ); ?></span>
    <?php 
    $subtitle = get_field( "subtitle" );

    if( $subtitle ) {
        echo '<p class="wc-subtitle">' . $subtitle . '</p>';
    }
    ?>
</a>