根据WooCommerce中的自定义字段值添加文本以订购摘要

根据WooCommerce中的自定义字段值添加文本以订购摘要

问题描述:

我已经成功添加了一个自定义字段到我的WooCommerce结帐页面,该页面是客户可以选择从其中收集项目的不同商店的选择器。目前它正在结帐页面上显示此字段,并且我正在使用jQuery在选择器下添加信息并相应地更新运输成本。根据WooCommerce中的自定义字段值添加文本以订购摘要

接下来需要做的是在客户订单电子邮件中添加关于每个取货地点的字段+附加信息。因此,举例来说,如果客户选择位置1的订单电子邮件应显示:

送货地点=位置1
地址= 123街
信息=拾取次序下午4个和晚上7点平日

之间我只是不确定如何将“Info”和“address”字段添加到数组中,然后能够在电子邮件中调用它们。

这是到目前为止我的代码:

add_filter('woocommerce_checkout_fields' , 'custom_store_pickup_field'); 

function custom_store_pickup_field($fields) { 

    $fields['billing']['store_pickup'] = array(
    'type'  => 'select', 
    'options' => array(
    'option_0'=> 'Please Select a Delivery Option', 
    'option_1' => 'Delivery', 
    'option_2' => 'Gym1', 
    'option_3' => 'Gym2' 
    ), 
'label'  => __('Store Pick Up Location (Optional)', 'woocommerce'), 
'required' => true, 
'class'  => array('store-pickup form-row-wide'), 
'id'  => 'store_pickup_val', 
'clear'  => true 
); 

return $fields; 
} 

//* Process the checkout 
add_action('woocommerce_checkout_process', 
'wps_select_checkout_field_process'); 
function wps_select_checkout_field_process() { 
global $woocommerce; 
// Check if set, if its not set add an error. 
if ($_POST['store_pickup'] == "option_0") 
wc_add_notice('<strong>Please select a Delivery option</strong>', 'error' 
); 
} 


add_action('woocommerce_after_checkout_form', 'gym_opening_hours', 6); 

function gym_opening_hours() { 

?> 
<script type="text/javascript"> 
    jQuery('#store_pickup_val').change(function(){ 

     jQuery('body').trigger('update_checkout'); 


     jQuery(".gym-collection").remove(); 

     if (this.value == 'option_1') { 
      jQuery('#shipping_method_0_flat_rate1').prop('checked', true); 
     } 

     if (this.value == 'option_2') { 
      jQuery("<p>Order can be collected between 4pm - 7pm on Tuesdays</p>").addClass("gym-collection").insertAfter("#store_pickup_val"); 
      jQuery('#shipping_method_0_local_pickup3').prop('checked', true); 
     } 
      if (this.value == 'option_3') { 
      jQuery("<p>Order can be collected between 4pm - 7pm on Tuesdays</p>").addClass("gym-collection").insertAfter("#store_pickup_val"); 
      jQuery('#shipping_method_0_local_pickup3').prop('checked', true);   
     } 
     else { 

     } 

    }); 
</script> 
<?php 

} 

这是你所需要的:

  • 格式并保存“拾取数据”为顺序的元数据(客户 - 前端)
  • 保存管理订单编辑页面(用于后端)的“取货地点”。
  • 以管理员顺序编辑页面(在后端)显示“取货地点”。
  • 显示“拾取html格式的数据”在订单视图和接收页面(前端)。
  • 在电子邮件通知中显示“拾取html格式的数据”(带有嵌入式样式)。

我也轻轻地重新审视你的代码:

add_filter('woocommerce_checkout_fields' , 'custom_store_pickup_field'); 
function custom_store_pickup_field($fields) { 
    $fields['billing']['store_pickup'] = array(
     'type'  => 'select', 
     'id'  => 'store_pickup_val', 
     'label' => __('Store Pick Up Location (Optional)', 'woocommerce'), 
     'required' => true, 
     'class' => array('store-pickup form-row-wide'), 
     'options' => array(
      ''=> 'Please Select a Delivery Option', 
      'option_1' => 'Delivery', 
      'option_2' => 'Gym1', 
      'option_3' => 'Gym2' 
     ), 
     'clear'  => true, 
    ); 
    return $fields; 
} 

//* Process the checkout 
add_action('woocommerce_checkout_process', 'wps_select_checkout_field_process'); 
function wps_select_checkout_field_process() { 
    // Check if set, if its not set add an error. 
    if ($_POST['store_pickup'] == "option_0") 
     wc_add_notice('<strong>Please select a Delivery option</strong>', 'error'); 
} 


add_action('woocommerce_after_checkout_form', 'gym_opening_hours', 6); 
function gym_opening_hours() { 
    ?> 
    <script type="text/javascript"> 
     (function($){ 
      $('#store_pickup_val').change(function(){ 
       $(".gym-collection").remove(); 
       if (this.value == 'option_1') { 
        $('#shipping_method_0_flat_rate1').prop('checked', true); 
       } else if (this.value == 'option_2') { 
        $("<p>Order can be collected between 4pm - 7pm on Tuesdays</p>").addClass("gym-collection").insertAfter("#store_pickup_val"); 
        $('#shipping_method_0_local_pickup3').prop('checked', true); 
       } else if (this.value == 'option_3') { 
        $("<p>Order can be collected between 4pm - 7pm on Tuesdays</p>").addClass("gym-collection").insertAfter("#store_pickup_val"); 
        $('#shipping_method_0_local_pickup3').prop('checked', true); 
       } 
       $('body').trigger('update_checkout'); 
      }); 
     })(jQuery); 
    </script> 
<?php 
} 

现在,你需要完成这个过程的代码:

// Save the delivery location data to the order meta 
add_action('woocommerce_checkout_update_order_meta', 'store_pickup_field_update_order_meta', 10, 1); 
function store_pickup_field_update_order_meta($order_id) { 

    // BELOW update the data 
    if ($_POST['store_pickup'] == 'option_2') 
     $data = array( 
      'location' => 'Location 1', 
      'address' => '123 Beverly street<br> 90001 Los Angeles' 
     ); 
    elseif ($_POST['store_pickup'] == 'option_3') 
     $data = array( 
     'location' => 'Location 2', 
     'address' => '456 Trumpet street<br> 90056 Los Angeles' 
    ); 

    $collect_info = 'Order can be collected between 4pm - 7pm on Tuesdays'; 

    if ($_POST['store_pickup'] == 'option_2' || $_POST['store_pickup'] == 'option_3'){ 
     // HTML 
     $store_pickup = "<h3>Pickup Information</h3> 
     <table class='pickup td' cellspacing='0' cellpadding='6'> 
      <tr> 
       <th>Location:</th> 
       <td>".$data['location']."</td> 
      </tr> 
      <tr> 
       <th><strong>Adress:</strong></th> 
       <td>".$data['address']."</td> 
      </tr> 
      <tr> 
       <th><strong>Info:</strong></th> 
       <td>".$collect_info."</td> 
      </tr> 
     </table>"; 

     // Save pickup html data (front end) 
     update_post_meta($order_id, '_store_pickup_data', $store_pickup); 
     // Save pickup location (backend) 
     update_post_meta($order_id, '_store_pickup_location', $data['location']); 
    } 
} 

// Display 'pickup location' on the order edit page (backend) 
add_action('woocommerce_admin_order_data_after_shipping_address', 'display_store_pickup_location_on_order_edit_pages', 10, 1); 
function display_store_pickup_location_on_order_edit_pages($order){ 
    $pickup_location = get_post_meta($order->get_id(), '_store_pickup_location', true); 
    if(! empty($pickup_location)) 
     echo '<p><strong>Store pickup location: </strong> ' . $pickup_location . '</p>'; 
} 

// Display 'pickup html data' in "Order received" and "Order view" pages (frontend) 
add_action('woocommerce_order_details_after_order_table', 'display_store_pickup_data_in_orders', 10); 
function display_store_pickup_data_in_orders($order) { 
    $pickup_data = get_post_meta($order->get_id(), '_store_pickup_data', true); 
    if(! empty($pickup_data)) 
     echo $pickup_data; 
} 

// Display 'pickup html data' in Email notifications (frontend) 
add_action('woocommerce_email_order_meta', 'display_store_pickup_data_in_emails', 10); 
function display_store_pickup_data_in_emails($order) { 
    $pickup_data = get_post_meta($order->get_id(), '_store_pickup_data', true); 
    if(! empty($pickup_data)){ 
     // Email CSS style rules 
     echo '<style> 
     table.pickup{width: 100%; font-family: \'Helvetica Neue\', Helvetica, Roboto, Arial, sans-serif; 
      color: #737373; border: 1px solid #e4e4e4;} 
     table.pickup th, table.pickup td{text-align: left; border-top-width: 4px; 
      color: #737373; border: 1px solid #e4e4e4; padding: 12px;} 
     table.pickup td{text-align: left; border-top-width: 4px; color: #737373; border: 1px solid #e4e4e4; padding: 12px;} 
     </style>'; 
     // Html data 
     echo $pickup_data; 
    } 

} 

代码放在您的活动子function.php文件主题(或主题)或任何插件文件。

经过测试并在WooCommerce 3+上工作。所以,你会得到这样的:

在管理员修改订单页:

enter image description here

为了查看和接收顺序页面:

enter image description here

在电子邮件通知:

enter image description here

+1

哦,这正是我正在寻找的东西 - 在PHP中使用条件 - 我最终围绕使用第二个使用Jquery条件语句填充的字段做了一个工作,但我认为你的清理更加清晰。当我得到一些时间,我会重新做插件。感谢堆! – timboon