MdMasud

WordPress, Laravel, Flutter

How to add and save Custom Fields in the WooCommerce Order Details page

·

,


Sometimes you need to store extra information for an order, such as a customer visit date. WooCommerce allows you to add your own fields to the order edit screen and save that information as order meta.


Adding a Custom Date and Time Field

add_action( 'woocommerce_admin_order_data_after_order_details', 'add_custom_field_for_order_details', 10, 1 );

function add_custom_field_for_order_details($order)
{
    $meta_key = '_customer_visit_date_time';
    $prev_value = get_post_meta($order->get_id(), $meta_key, true);

    $field_value_date = '';
    $field_value_hour = '';
    $field_value_minute = '';

    if ($prev_value) {
        $field_value_date = date('Y-m-d', strtotime($prev_value));
        $field_value_hour = date('h', strtotime($prev_value));
        $field_value_minute = date('i', strtotime($prev_value));
    }
    ?>
    <p class="form-field form-field-wide wc-order-vist-date">
        <label for="customer_visit_date">Visit Date:</label>
        <input type="text" class="date-picker" placeholder="yyyy-mm-dd"
               name="visit_date_date" maxlength="10" value="<?= $field_value_date ?>">
        @
        <input type="number" class="hour" placeholder="h" name="visit_date_hour"
               min="0" max="23" value="<?= $field_value_hour ?>">
        :
        <input type="number" class="minute" placeholder="m" name="visit_date_minute"
               min="0" max="59" value="<?= $field_value_minute ?>">
        <br/><span class="description">Select a date and time (24h format)</span>
    </p>
    <?php
}


Saving the Custom Field

add_action('woocommerce_process_shop_order_meta', 'save_custom_fields_for_order_details');

function save_custom_fields_for_order_details($order_id)
{
    $order = wc_get_order($order_id);

    $visit_date_date = wc_clean($_POST['visit_date_date']);
    $visit_date_hour = wc_clean($_POST['visit_date_hour']);
    $visit_date_minute = wc_clean($_POST['visit_date_minute']);

    $visit_date_time = $visit_date_date.' '.$visit_date_hour.':'.$visit_date_minute;

    $order->update_meta_data('_customer_visit_date_time', $visit_date_time);
    $order->save();
}


Adding custom fields to the WooCommerce order details screen is straightforward and allows you to store important data directly with each order.

Comments

Leave a Reply

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