在 Woocommerce 结账付款后移动优惠券字段？

Question

我想在结帐付款后移动优惠券文件。这是我已经尝试过的所有准备工作：

remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form');
add_action( 'woocommerce_after_checkout_form', 'woocommerce_checkout_coupon_form' );

现在是结帐表格之后。

谢谢！

Answer 1

Coupan 代码是单独的形式，因此您需要按照以下步骤操作：

为了实现这一举措，我将使用 jQuery UI 对话框库来帮助我实现对话框功能。在 functions.php 中添加以下代码（如果您的网站尚未包含 jQuery UI 对话框库）。

function cw_scripts() {
    wp_enqueue_script('jquery-ui-dialog');
}
add_action('wp_enqueue_scripts', 'cw_scripts');

接下来，创建一个 jQuery 模型对话框的实例，其中包含优惠券代码的所有内容。定位模型对话框，使其锚定到结帐表单内的 HTML 元素。使用现有的 WooCommerce 过滤器（或操作）将 HTML 元素放置在结帐表单中您想要的位置。在functions.php中添加如下代码：

function cw_show_coupon_js() {
    wc_enqueue_js('$("a.showcoupon").parent().hide();');
    wc_enqueue_js('dialog = $("form.checkout_coupon").dialog({
                       autoOpen: false,
                       width: 500,
                       minHeight: 0,
                       modal: false,
                       appendTo: "#coupon-anchor",
                       position: { my: "left", at: "left", of: "#coupon-anchor"},
                       draggable: false,
                       resizable: false,
                       dialogClass: "coupon-special",
                       closeText: "Close",
                       buttons: {}});');
    wc_enqueue_js('$("#show-coupon-form").click( function() {
                       if (dialog.dialog("isOpen")) {
                           $(".checkout_coupon").hide();
                           dialog.dialog( "close" );
                       } else {
                           $(".checkout_coupon").show();
                           dialog.dialog( "open" );
                       }
                       return false;});');
}
add_action('woocommerce_before_checkout_form', 'cw_show_coupon_js');

接下来，要在表单中显示优惠券字段，请添加“单击此处输入您的代码 link”。此代码将在客户详细信息和订单详细信息部分之间添加 link。为了查看此 link 的其他位置，您可以查看结帐页面上的其他 WooCommerce 操作和过滤器（woocommerce_checkout_fields 或 woocommerce_before_checkout_billing_form）。如果您找不到合适的过滤器或方法，您可以覆盖默认的 WooCommerce 结帐页面模板并在您想要的位置找到 link。

function cw_show_coupon() {
    global $woocommerce;

    if ($woocommerce->cart->needs_payment()) {
        echo '<p style="padding-bottom: 5px;"> Have a coupon? <a href="#" id="show-coupon-form">Click here to enter your coupon code</a>.</p><div id="coupon-anchor"></div>';
    }
}
add_action('woocommerce_checkout_after_customer_details', 'cw_show_coupon');

Answer 2

你应该试试这个：

remove_action( 'woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10 );
add_action( 'woocommerce_review_order_before_payment', 'woocommerce_checkout_coupon_form' );

但不确定它是否会起作用...您还应该需要自定义 Woocommerce 模板 checkout/form-coupon.php via your active theme...

在 Woocommerce 结账付款后移动优惠券字段？

Move coupon field after checkout payment in Woocommerce?

php

wordpress

woocommerce

hook-woocommerce