WooCommerce:为购物车中的每个商品添加输入字段

时间:2014-02-08 18:25:15

标签: wordpress woocommerce

我一直在尝试将单个文本输入字段添加到购物车中的每个项目,并将该用户输入提交到产品的元信息。已经2天了,我还没有成功。

我的目标是:

  1. 从添加到购物车的每件商品中获取用户的输入。
  2. 在订单的元信息中显示该输入。
  3. 在发送给客户的确认电子邮件中显示该输入。
  4. 到目前为止,我已将模板文件复制到我的主题并在单元格中添加了一个输入字段。我在使用钩子时遇到问题,从WooCommerce Product Gift Wrap插件中了解了我需要的钩子,如woocommerce issue所示。

    代码我添加到我的主题目录中复制的cart.php模板中:

    $input_url_data = '<div class="input-url"><input type="text" name="cart-url" value="" title="" class="input-text cart-url text" /></div>';
    
    echo apply_filters( 'woocommerce_add_cart_item_data', $input_url_data, $cart_item_key );
    

    代码我添加到我的主题的functions.php:

    add_filter( 'woocommerce_add_cart_item_data','add_cart_item_data', 10, 2 );
    add_filter( 'woocommerce_get_cart_item_from_session','get_cart_item_from_session', 10, 2 );
    add_filter( 'woocommerce_get_item_data','get_item_data', 10, 2 );
    add_filter( 'woocommerce_add_cart_item','add_cart_item', 10, 1 );
    add_action( 'woocommerce_add_order_item_meta','add_order_item_meta', 10, 2 );
    
    function add_cart_item_data( $cart_item_meta, $product_id ) {
        $input_url_key = "";
        $input_url_data['inputurl'] = $input_url_key;
        return $input_url_data;
    }
    
    function get_cart_item_from_session( $cart_item, $values ) {
    
    if ( ! empty( $values['inputurl'] ) ) {
        $cart_item['inputurl'] = true;
    }
    return $cart_item;
    }
    
    function get_item_data( $item_data, $cart_item ) {
    
    if ( ! empty( $cart_item['inputurl'] ) )
        $item_data[] = array(
        );
    return $item_data;
    }
    
    function add_cart_item( $cart_item ) {
    if ( ! empty( $cart_item['inputurl'] ) ) {
    
    }
    return $cart_item;
    }
    
    function add_order_item_meta( $item_id, $cart_item ) {
    if ( ! empty( $cart_item['inputurl'] ) )
    woocommerce_add_order_item_meta( $item_id, __( 'URL by buyer', 'custom_input_url' ), __( 'Yes', 'custom_input_url' ) );
    }
    

    关于hook woocommerce_add_cart_item_data的文档不是很有帮助,我对此感到困惑。我该怎么办?

3 个答案:

答案 0 :(得分:20)

出于确切目的,有一个名为WC Fields Factory的wordpress插件。

您还可以使用以下woocommerce挂钩woocommerce_before_add_to_cart_buttonwoocommerce_add_to_cartwoocommerce_cart_item_name'woocommerce_add_order_item_meta'

来实现此目的

喜欢将文本字段添加到产品页面

function add_name_on_tshirt_field() {
  echo '<table class="variations" cellspacing="0">
      <tbody>
          <tr>
          <td class="label"><label for="color">Name On T-Shirt</label></td>
          <td class="value">
              <input type="text" name="name-on-tshirt" value="" />
          </td>
      </tr>                             
      </tbody>
  </table>';
}
add_action( 'woocommerce_before_add_to_cart_button', 'add_name_on_tshirt_field' );

要在购物车项目表上显示自定义字段,请使用以下

function render_meta_on_cart_item( $title = null, $cart_item = null, $cart_item_key = null ) {
    if( $cart_item_key && is_cart() ) {
        echo $title. '<dl class="">
                 <dt class="">Name On T-Shirt : </dt>
                 <dd class=""><p>'. WC()->session->get( $cart_item_key.'_name_on_tshirt') .'</p></dd>           
              </dl>';
    }else {
        echo $title;
    }
}
add_filter( 'woocommerce_cart_item_name', 'render_meta_on_cart_item', 1, 3 );

要在您订购详细信息上制作自定义元数据,请执行以下操作

function tshirt_order_meta_handler( $item_id, $values, $cart_item_key ) {
    wc_add_order_item_meta( $item_id, "name_on_tshirt", WC()->session->get( $cart_item_key.'_name_on_tshirt') );    
}
add_action( 'woocommerce_add_order_item_meta', 'tshirt_order_meta_handler', 1, 3 );

详细实现,我有一篇关于如何在不使用任何插件的情况下执行此操作的文章。 http://sarkware.com/how-to-pass-custom-data-to-cart-line-item-in-woocommerce-without-using-plugins/

答案 1 :(得分:7)

这很容易。尝试搜索和阅读Woocommerce的代码。

这么多代码让我指出了我可以添加Url @ Cart的地方。我可以在订单审核中将其视为客户和管理员。

我无法测试电子邮件,因为我很懒。对不起。

像这样的东西在templates \ cart \ cart.php中(需要更多的代码,因为它是单独的列)

<td class="product-url">
    <?php
        $html = sprintf( '<div class="url"><input type="text" name="cart[%s][url]" value="%s" size="4" title="Url" class="input-text url text" /></div>', $cart_item_key, esc_attr( $values['url'] ) );
        echo $html;
    ?>
</td>

的functions.php

// get from session your URL variable and add it to item
add_filter('woocommerce_get_cart_item_from_session', 'cart_item_from_session', 99, 3);
function cart_item_from_session( $data, $values, $key ) {
    $data['url'] = isset( $values['url'] ) ? $values['url'] : '';
    return $data;
}

// this one does the same as woocommerce_update_cart_action() in plugins\woocommerce\woocommerce-functions.php
// but with your URL variable
// this might not be the best way but it works
add_action( 'init', 'update_cart_action', 9);
function update_cart_action() {
    global $woocommerce;
    if ( ( ! empty( $_POST['update_cart'] ) || ! empty( $_POST['proceed'] ) ) && $woocommerce->verify_nonce('cart')) {
        $cart_totals = isset( $_POST['cart'] ) ? $_POST['cart'] : '';
        if ( sizeof( $woocommerce->cart->get_cart() ) > 0 ) {
            foreach ( $woocommerce->cart->get_cart() as $cart_item_key => $values ) {
                if ( isset( $cart_totals[ $cart_item_key ]['url'] ) ) {
                    $woocommerce->cart->cart_contents[ $cart_item_key ]['url'] = $cart_totals[ $cart_item_key ]['url'];
                }
            }
        }
    }
}

// this is in Order summary. It show Url variable under product name. Same place where Variations are shown.
add_filter( 'woocommerce_get_item_data', 'item_data', 10, 2 );
function item_data( $data, $cart_item ) {
    if ( isset( $cart_item['url'] ) ) {
        $data['url'] = array('name' => 'Url', 'value' => $cart_item['url']);
    }
    return $data;
}

// this adds Url as meta in Order for item
add_action ('woocommerce_add_order_item_meta', 'add_item_meta', 10, 2);
function add_item_meta( $item_id, $values ) {
    woocommerce_add_order_item_meta( $item_id, 'Url', $values['url'] );
}

400 $很不错。

答案 2 :(得分:0)

您可以使用Woocommerce Product Add-ons plugin

轻松完成此操作

来自WooThemes网站:

  

允许您的客户通过添加新选项来自定义您的产品   例如输入框,下拉列表或复选框。使用产品附加组件   延伸,礼品消息,捐赠,激光雕刻和任何其他   现在可以选择以某种方式需要用户输入的产品   你的客户!

     

产品附加组件支持必填字段,textareas,复选框,   收音机,选择框,自定义价格输入和文件上传框。

之前我曾使用它为产品购买添加额外的捐赠字段,并在感谢页/收据电子邮件中显示。

它大约是50美元,它会立即启动并运行,添加文本输入并在感谢页面/电子邮件中显示您想要的字段。 50美元绝对值得您节省干燥时间以自行开发此功能。

以下是最终用户观点的流程:

最终用户输入现场数据并将产品添加到购物车 End User enters in field data and adds product to cart

当用户查看购物车时,他们输入自定义字段的数据会与产品一起显示 When User views cart the data they entered into the custom field displays along with the product

购买后,最终用户登陆感谢页面并收到包含产品项目字段数据的收据电子邮件。 After purchase, end user lands on thank you page and receives receipt email with field data included with the product item.

在后端:

为每个产品创建自定义字段。该选项位于“附加”菜单选项卡上。

  1. 创建新的插件组
  2. 输入群组名称(以便于组织)
  3. 添加新选项并输入标签(这是最终用户看到并与产品绑定的内容)
  4. 更新/发布产品。
  5. Create custom field for each product

    对于已完成的订单,您将在订单明细管理员中看到:

    product order details page also displays the field

    希望这有助于您节省大量时间进行开发!