Add Extra Data When WooCommerce Products Are Added to the Cart and Display It in the Cart, Checkout, and Orders

WooCommerce is an open ecommerce system, which means we can extend it into many different purchase flows, such as booking systems, paid memberships, and other custom products. A key part of that work is attaching extra data when a product is added to the cart and then carrying that data all the way through checkout into the final order.

In this example, we add a field before the Add to Cart button, capture the submitted value when the user adds the product to the cart, and then display or save that extra information in the right places.

First, add the form field

The first step is to add a field to the product page. In this example it is a hidden field, and its value is filled with JavaScript. Depending on your use case, you could also use uploads, date pickers, or other field types.

add_action( 'woocommerce_before_add_to_cart_button', function () {
    ?>
    <div class="product_image-field">
        <input type="hidden" name="product_image">
    </div>
    <?php
}, 10 );

Step 2: Read the extra information when the item is added to the cart

Next, capture the submitted field value and attach it to the cart item data. At this stage the extra information is stored in the WooCommerce session.

add_filter( 'woocommerce_add_cart_item_data', function ( $cart_item_data, $product_id ) {
    $new_value = [];

    if ( isset( $_POST['product_image'] ) ) {
        $new_value['selected_product'] = $_POST['product_image'];

        if ( ! empty( $new_value ) ) {
            $cart_item_data['_custom_options'] = $new_value;
        }
    }

    return $cart_item_data;
}, 10, 2 );

Step 3: Load the extra information back from the session

This step restores the custom value from the session and places it back on the cart item object so it is available in later hooks.

add_filter( 'woocommerce_get_cart_item_from_session', function ( $item, $values, $key ) {
    if ( array_key_exists( 'selected_product', $values ) ) {
        $item['selected_product'] = $values['selected_product'];
    }

    return $item;
}, 1, 3 );

Step 4: Display the extra information in the cart and checkout

The extra information needs to be visible in the cart so the customer understands exactly what was added. This same information can also be shown in mini-cart and checkout views.

add_filter( 'woocommerce_cart_item_name', function ( $product_name, $values, $cart_item_key ) {
    if ( array_key_exists( 'selected_product', $values ) ) {
        $product_name .= '<br /><img src="' . esc_url( $values['selected_product'] ) . '">';
    }

    return $product_name;
}, 10, 3 );

Step 5: Save the extra information into the order data

When the customer checks out, we can save the custom value into the order item meta so that customer service, fulfillment, or other back-office staff can work with it later.

add_action( 'woocommerce_add_order_item_meta', function ( $item_id, $values ) {
    wc_add_order_item_meta( $item_id, 'selected_product', $values['selected_product'] );
}, 1, 2 );

Final step: Recalculate the price based on the user’s choice

If the submitted extra data should change the product price, recalculate the line item price before totals are calculated.

add_action( 'woocommerce_before_calculate_totals', function ( $cart_object ) {
    foreach ( $cart_object->cart_contents as $cart_item_key => $value ) {
        $value['data']->set_price( $value['_custom_options']['custom_price'] );
    }
}, 1, 1 );

Once you understand the flow, adding extra information to cart items and pushing it into orders is actually quite straightforward. The most important part is finding the correct WooCommerce hook for each stage of the process.

Beyond the hooks, the real complexity usually comes from business rules. A ticketing system may need to lock seats and release them on payment timeout. A membership system may need to upgrade user roles and set expiration times automatically. The hooks are the easy part; the workflow is where the project-specific logic lives.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *