Display ACF product custom fields everywhere in WooCommerce 3+

Question

I am building a site using WooCommerce and Advanced Custom Fields (ACF) plugin. I've created two ACF custom fields with names "plant" and "amount".

I am trying to display them both on front end but currently only the custom field "plant" is displaying everywhere. I've been looking around the net with no luck.

add_action( 'woocommerce_before_add_to_cart_button', 'add_custom_field', 0 );

function add_custom_field() {
    global $product;             // Changed this

    // Added this too (compatibility with WC +3) 
    $product_id = method_exists( $product, 'get_id' ) ? $product->get_id() : $product->id;

    echo "<div class='produto-informacoes-complementares'>";
    echo get_field( 'plant', $product_id );
    echo "</div>";
    echo "<div class='produto-informacoes-complementares'>";
    echo get_field( 'amount', $product_id );
    echo "</div>";


    return true;
}


add_filter( 'woocommerce_add_cart_item_data', 'save_my_custom_product_field', 10, 2 );

function save_my_custom_product_field( $cart_item_data, $product_id ) {

    $custom_field_value = get_field( 'plant', $product_id, true );
     $custom_field_value = get_field( 'amount', $product_id, true );

    if( !empty( $custom_field_value ) ) 
    {
        $cart_item_data['plant'] = $custom_field_value;
         $cart_item_data['amount'] = $custom_field_value;

        // below statement make sure every add to cart action as unique line item
        $cart_item_data['unique_key'] = md5( microtime().rand() );
    }
    return $cart_item_data;
}

add_filter( 'woocommerce_get_item_data', 'render_meta_on_cart_and_checkout', 10, 2 );

function render_meta_on_cart_and_checkout( $cart_data, $cart_item ) {
    $custom_items = array();
    // Woo 2.4.2 updates
    if( !empty( $cart_data ) ) {
        $custom_items = $cart_data;
    }
    if( isset( $cart_item['plant'] )) {
        $custom_items[] = array( "name" => "גודל עציץ", "value" => $cart_item['plant'] );
        $custom_items[] = array( "name" => "כמות במגש", "value" => $cart_item['amount'] );
        
    }
    return $custom_items;
}

function add_order_item_meta_acf( $item_id, $values ) {

    wc_add_order_item_meta( $item_id, 'גודל עציץ', $values [ 'plant' ] );
    wc_add_order_item_meta( $item_id, 'גודל עציץ', $values [ 'amount' ] );
  }
add_action( 'woocommerce_add_order_item_meta', 'add_order_item_meta_acf' , 10, 2);

Can you show a snippet of how the resulting html with plant? — axwr
i am not a programmer i can only show an image succulenteria.com/wp-content/uploads/2020/12/… — Avidan Banks
Ah i see, unfortunately i think it will be hard for someone to diagnose this issue for you without being able to see the resultant HTML, although hopefully i am wrong. — axwr
thanks so much ,amazingly i went over the code and realized that i didnt close with brackets now its working right , been four days on this code . — Avidan Banks
Ah congratulations! You should consider posting that as an answer. You are allowed to answer your own questions. — axwr

LoicTheAztec LoicTheAztec · Accepted Answer · 2020-12-23T03:39:48

Your code is a bit outdated and with some mistakes. Use the following to display product ACF custom fields everywhere (product page, cart, checkout, orders and email notifications):

// Display on product page
add_action( 'woocommerce_before_add_to_cart_button', 'display_acf_single_product_pages', 1 );
function display_acf_single_product_pages() {
    global $product;

    $plant  = get_field( 'plant',  $product->get_id() );
    $amount = get_field( 'amount', $product->get_id() );

    if ( ! empty($plant) && ! empty($amount) ) {
        echo '<div class="produto-informacoes-complementares">';

        if ( ! empty($plant) ) {
            echo '<div class="plant"><strong>' . __("Size", "woocommerce") . '</strong>: ' . $plant . '</div>';
        }

        if ( ! empty($amount) ) {
            echo '<div class="amount"><strong>' . __("Amount", "woocommerce") . '</strong>: ' . $amount . '</div>';
        }

        echo '</div>';
    }
}

// Display on cart and checkout
add_filter( 'woocommerce_get_item_data', 'display_acf_on_cart_and_checkout', 10, 2 );
function display_acf_on_cart_and_checkout( $cart_data, $cart_item ) {
    $plant  = get_field( 'plant', $cart_item['product_id'] );
    $amount = get_field( 'amount', $cart_item['product_id'] );

    if ( ! empty($plant) ) {
        $custom_items[] = array( "name" => __("Size", "woocommerce"),  "value" => $plant  );
    }

    if ( ! empty($amount) ) {
        $custom_items[] = array( "name" => __("Amount", "woocommerce"), "value" => $amount );
    }
    return $custom_items;
}

// Display on orders and email notifications (save as custom order item meta data)
add_action( 'woocommerce_checkout_create_order_line_item', 'display_acf_on_orders_and_emails', 10, 4 );
function display_acf_on_orders_and_emails( $item, $cart_item_key, $values, $order ) {
    $plant  = get_field( 'plant', $values['product_id'] );
    $amount = get_field( 'amount', $values['product_id'] );

    if ( ! empty($plant) ) {
        $item->add_meta_data( __("Size", "woocommerce"), $plant );
    }

    if ( ! empty($amount) ) {
        $item->add_meta_data( __("Amount", "woocommerce"), $amount );
    }
}

Code goes in functions.php file of the active child theme (or active theme). Tested and works.

Display ACF product custom fields everywhere in WooCommerce 3+

1 Answers