Woocommerce (收银台-页)-订购后替换内容

Question

这个问题与thankyou page有关。

我创建了自己的自定义感谢您布局，它有一个短代码，即[custom-thankyou-054]**.**

-

通常情况下，当您下单时，结帐页面会告诉您一个Thank you. Your order has been received.和关于您的订单的一些细节。

我不想展示所有这些细节。我设计了一个更简单、更交互式的布局，我想用它代替。

我想知道是否有一个钩子可以这样做？

我知道下订单后要重定向到另一个页面。

add_action( 'woocommerce_thankyou', 'bbloomer_redirectcustom');

function bbloomer_redirectcustom( $order_id ){
    $order = wc_get_order( $order_id );
    $url = 'https://yoursite.com/custom-url';
    if ( ! $order->has_status( 'failed' ) ) {
        wp_safe_redirect( $url );
        exit;
    }
}

不幸的是，这不是我的情况。我希望用户继续使用该checkout page，但只在下订单后用自定义布局更改其内容，如下所示：

add_action( '??????????', 'change_checkout_page_content_after_placing_order'); 
function change_checkout_page_content_after_placing_order( $order_id ){
 return do_shortcode('[custom-thankyou-054]');
}

这有可能吗？

Answer 1

你做错了，但你已经足够接近了。

不要直接用Elementor将元素添加到结帐页面。因为您只想在签出表单的顶部和底部添加元素，所以可以使用签出表单顶部的钩子woocommerce_before_checkout_form和签出表单底部的woocommerce_after_checkout_form。

如果您真的想使用Elementor来设计签出表单的顶部和底部的元素，那么我建议您按照创建感谢模板的方式，然后使用它的短代码。

例如，您创建了一个为签出表单的顶部和底部设计的模板，其中的短代码类似于[my-top-design]和[my-bottom-design]。然后转到您的function.php并执行以下操作。

/** This will add your template designed for the top of the checkout form **/
add_action('woocommerce_before_checkout_form', 'custom_top_checkout_form');
function custom_top_checkout_form(){
    echo do_shortcode('[my-top-design]');
    /**You can also insert an html tag here instead of the shortcode of your template..**/
    // echo '<h2>Some top elements...</h2>';
}

/** This will add your template designed for the bottom of the checkout form **/
add_action('woocommerce_after_checkout_form', 'custom_bottom_checkout_form');
function custom_bottom_checkout_form(){
    echo do_shortcode('[my-bottom-design]');
    /**You can also insert an html tag here instead of the shortcode of your template..**/
    // echo '<h2>Some bottom elements...</h2>';
}

下订单后，包括顶部和底部元素在内的所有结帐表单都将消失，并将用感谢页面替换它。

现在，使用您的感谢页面，您可以使用WooCommerce模板覆盖覆盖它。

复制：

/wp-content/plugins/woocommerce/templates/checkout/thankyou.php。

在您的活动主题中，应该是这样的：

/wp-content/themes/activetheme/woocommerce/checkout/thankyou.php

然后编辑thankyou.php并使用自定义模板删除替换中不必要的信息--谢谢再次使用这些短代码。

会是这样的。

<?php
defined( 'ABSPATH' ) || exit;
?>

<div class="woocommerce-order">

    <?php if ( $order ) :

        do_action( 'woocommerce_before_thankyou', $order->get_id() ); ?>

        <?php if ( $order->has_status( 'failed' ) ) : ?>

            <p class="woocommerce-notice woocommerce-notice--error woocommerce-thankyou-order-failed"><?php esc_html_e( 'Unfortunately your order cannot be processed as the originating bank/merchant has declined your transaction. Please attempt your purchase again.', 'woocommerce' ); ?></p>

            <p class="woocommerce-notice woocommerce-notice--error woocommerce-thankyou-order-failed-actions">
                <a href="<?php echo esc_url( $order->get_checkout_payment_url() ); ?>" class="button pay"><?php esc_html_e( 'Pay', 'woocommerce' ); ?></a>
                <?php if ( is_user_logged_in() ) : ?>
                    <a href="<?php echo esc_url( wc_get_page_permalink( 'myaccount' ) ); ?>" class="button pay"><?php esc_html_e( 'My account', 'woocommerce' ); ?></a>
                <?php endif; ?>
            </p>

        <?php else : ?>
            <?php 
                //your custom template here...
                echo do_shortcode('[custom-thankyou-054]'); 
            ?>  
        <?php endif; ?>
    <?php else : ?>

        <p class="woocommerce-notice woocommerce-notice--success woocommerce-thankyou-order-received"><?php echo apply_filters( 'woocommerce_thankyou_order_received_text', esc_html__( 'Thank you. Your order has been received.', 'woocommerce' ), null ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></p>

    <?php endif; ?>

</div>