在Woocommerce支付结账后移动优惠券字段?

时间:2017-10-30 09:22:04

标签: php wordpress woocommerce hook-woocommerce

我想在结帐付款后移动优惠券文件。这就是我所做的一切准备好了:

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

目前正在结帐表格之后。

谢谢!

2 个答案:

答案 0 :(得分:3)

You should try this:

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

But not sure that it will be functional… You should need also to customize the Woocommerce template checkout/form-coupon.php via your active theme

答案 1 :(得分:0)

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

要实现此移动,我将使用jQuery UI Dialog库来帮助我完成对话功能。在functions.php中,添加以下代码(在这种情况下,如果您的网站尚未包含jQuery UI对话框库)。

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

接下来,创建一个包含优惠券代码所有内容的jQuery Model Dialog实例。定位模型对话框,使其锚定到结帐表单中的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');

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

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');