首页 > 解决方案 > 在重定向到 Woocommerce 中的支付网关页面之前打开弹出消息

问题描述

在将用户重定向到我的支付网关页面之前,我不想向用户显示弹出消息(在我的情况下,我使用 PayU Latam)。我对文件进行了一些修改,但woocomerce > templates > checkout > payment.php没有成功,因为虽然我实现了打开弹出窗口,但弹出窗口打开但 1 秒后重定向到 PayU 页面。我想在用户关闭弹出窗口后找到将用户重定向到支付页面的方法。

有任何想法吗?

标签: woocommercepopup

解决方案


您可以在 payment.php 中的“下订单”按钮上方为您的弹出框添加一个新链接。然后使用 CSS 隐藏原始的 Place Order 按钮,并在单击弹出消息中的“确认”按钮时使用 jQuery 触发它。

这是一个使用来自https://jquerymodal.com/的 jQuery Modal 的示例作为弹出框,因为您没有提供任何可使用的代码。您可以根据已有的代码调整它。

在弹出窗口内点击触发订单按钮的jQuery:

<script>
jQuery(document).ready(function($){
    $( "a#close_and_confirm_checkout" ).click(function() {
        $( "button#place_order" ).click();
    });
});
</script>

您的新“下订单”按钮、弹出消息和用于确认结帐的新按钮的 HTML:

<a href="#confirm_checkout" rel="modal:open">Place Order</a>

<div id="confirm_checkout" class="modal">
    <p>Your popup message</p>
    <a href="#" rel="modal:close" id="close_and_confirm_checkout">Confirm Order</a>
</div>

最后隐藏 CSS 中的原始 WooCommerce 下订单按钮,该按钮将由弹出框中的新按钮触发:

#place_order { display:none; }

测试和工作。您可以选择在单击新的“确认订单”按钮时关闭弹出框,我认为最好以防用户未完成结帐表单中的所有必填字段,但您始终可以进一步开发以检查这些只有在必填字段为空时才关闭该框。


推荐阅读