如何以编程方式编辑 WooCommerce 感谢页面

已发表: 2021-06-08

您想在您的商店中自定义感谢页面吗？在本指南中，我们将向您展示以编程方式编辑 WooCommerce 感谢页面的不同方法。

为什么要自定义 WooCommerce 感谢页面？

感谢页面是用户在完成订单后看到的页面。默认情况下，它只是简单地感谢购物者的购买，并提供有关订单的基本信息，例如订单号、购买的商品、价格、付款方式等。这没有什么问题，但您可以更好地利用此页面。

感谢页面经常被忽视，但功能非常强大。请记住，您的所有购物者在下订单后都会看到它，因此这是向您的客户追加销售或提供有用信息的绝佳机会。通过自定义感谢页面，您可以为购物者提供更好的售后体验。

如果有人看到您的感谢页面，那是因为他们已从您的商店下订单。这意味着他们信任您（至少足以向您购买）。您可能知道，与新客户相比，向已经从您那里购买过产品的人出售产品要容易得多。即使你的主要目标可能不是卖东西，你也可以努力把那个购物者变成回头客。

例如，您可以编辑感谢页面并添加有用的指南、用户可以分享以获得奖励的推荐链接、独家优惠、未来购买的折扣等等。

您可以通过多种方式自定义“感谢您”页面以改善用户体验并让客户返回您的商店。在以下部分中，我们将向您展示以编程方式编辑 WooCommerce 感谢页面的不同方法。

如何以编程方式编辑 WooCommerce 感谢页面：2 种方法

在 WooCommerce 中以编程方式编辑感谢页面有两种主要方法：

使用钩子
覆盖模板文件

此外，您还可以根据每个特定要求组合这两种方法。

让我们仔细看看这两种方式。

注意：由于我们将编辑一些核心文件，因此在开始之前，我们建议您创建站点的完整备份并安装子主题。如果您不确定如何操作，请查看本指南以创建一个或使用这些插件中的任何一个。

1) 使用钩子自定义感谢页面

要运行 WooCommerce 钩子，我们将处理子主题的functions.php文件。我们需要这个文件来覆盖父主题中的那个。

WooCommerce 提供的一些钩子在Thank You 页面上起作用，例如woocommerce_before_thankyou和woocommerce_thankyou 。此外，您可以使用过滤器挂钩编辑标题和内容，例如woocommerce_endpoint_order-received_title和woocommerce_thankyou_order_received_text 。

要使用这些钩子中的任何一个，您将通过将以下代码段添加到子主题的functions.php文件中来触发它们中的每一个：

 add_action('woocommerce_before_thankyou','QuadLayers_before_thankyou');
函数 QuadLayers_before_thankyou(){
    回声“测试”；
}

过滤器挂钩以类似的方式工作，但它们必须返回一个值。 “woocommerce_before_thankyou”过滤器挂钩将编辑感谢页面的标题，如下所示：

 add_filter('woocommerce_endpoint_order-received_title','QuadLayers_thank_you_title'); 
函数 QuadLayers_thank_you_title( $old_title ){ 
     return '你真棒！'; 
}

2）编辑感谢页面覆盖模板文件

以编程方式编辑 WooCommerce 感谢页面的另一种方法是覆盖模板文件。值得注意的是，覆盖模板文件为您提供了很大的灵活性，但是当您覆盖模板文件时，对该文件起作用的钩子将不再起作用。

要覆盖模板文件，您需要复制位于 WC 插件模板文件夹中的thankyou.php文件，并将同名文件粘贴到您的子主题的 WooCommerce 文件夹中，包括 checkout 子文件夹，如下所示：

覆盖感谢页面 woocommerce 模板

要了解有关如何在 WooCommerce 中自定义模板文件的更多信息，请查看本指南。

之后，您将能够自由编辑您的子主题的thankyou.php文件并覆盖默认文件。

以编程方式编辑 WooCommerce 感谢页面的示例脚本

在本节中，我们将向您展示可用于以编程方式编辑 WooCommerce 感谢页面的不同脚本。对于本教程，我们将使用 Storefront 主题，因此如果您使用不同的主题，它可能看起来会有些不同。

这是 WooCommerce 中默认的感谢页面的外观：

如何在 WooCommerce 中自定义感谢页面

1) 向感谢页面添加自定义内容

如前所述，我们可以使用 WooCommerce 挂钩来添加自定义标题。这次我们将添加更多有用的内容，以便客户可以在社交媒体上关注我们。

将以下代码粘贴到您的子主题的functions.php文件中：

 add_filter('woocommerce_endpoint_order-received_title','QuadLayers_thank_you_title'); 
函数 QuadLayers_thank_you_title( $old_title ){ 
     return '你真棒！'; 
}
add_filter('woocommerce_thankyou_order_received_text', 'QuadLayers_thank_you_details', 20, 2); 
函数 QuadLayers_thank_you_details( $thank_you_title, $order ){ 
    $str= '<h3><b>哦' 。 $order->get_billing_first_name() 。 '</b>，非常感谢您的订购！</h3>';
    $str.='<p>我们会尽快与您联系以交付您购买的商品。</p>';
    $str.='<p>敬请关注以获取最新公告并在我们的社交媒体资料上关注我们</p>>';
    $str.= '<div><div><a href="#twitter.com"><img src="https://upload.wikimedia.org/wikipedia/commons/c/ce/Twitter_Logo.png" / ></a></div>'; 
    $str.='<div><a href="#facebook.com"><img src="https://upload.wikimedia.org/wikipedia/commons/5/51/Facebook_f_logo_%282019%29.svg" /></a></div>'; 
    $str.='<div><a href="#instagram.com"><img src="https://cdn2.iconfinder.com/data/icons/social-media-2285/512/1_Instagram_colored_svg_1-512。 png" /></a></div></div>';
   $str.='<p>这里是有关您的订单的所有信息。 干杯！</p>';    
    返回 $str;
}

请记住将图像 URL 替换为您自己的网站 URL 路径。最重要的是，您需要在您的社交媒体资料中插入反向链接，因此当用户点击链接时，他们将成为关注者。

这将是结果：

在感谢页面上包含自定义内容

2）在感谢页面上显示产品信息

另一个有趣的选择是展示其他产品，这样客户就可以购买他们感兴趣的其他商品。要展示特定产品，您可以使用 WooCommerce 短代码，如下所示：

 add_action('woocommerce_thankyou', 'QuadLayers_thankyou_page', 10, 2);
函数 QuadLayers_thankyou_page(){
   $sh = '<h4>您可能想查看这些其他产品。 </h4>';
  $sh .='<div class="tx_account">'.do_shortcode(' ').'</div>';
    回声 $sh;
}

在这里，我们使用产品简码来显示特色产品，结果是这样的：

在感谢页面上显示产品信息

3) 在感谢页面上显示帐户详细信息

同样，我们可以附加用户帐户的详细信息，并显示有用的选项卡以及他们的订单、地址、帐户信息等。

 add_action('woocommerce_thankyou', 'QuadLayers_thankyou_page', 10, 2);
函数 QuadLayers_thankyou_page(){
   $sh = "<h2>你的账户</h2>";
   $sh .='<div class="tx_account">'.do_shortcode(' [ woocommerce_my_account ] ').'</div>'; 回声 $sh; }

将其粘贴到functions.php文件后，您的感谢页面应如下所示：

在感谢页面上显示帐户详细信息

4）购买超过一定总价时赠送优惠券

自定义“感谢您”页面可能是将偶尔购物者转变为忠实客户的好方法。未来购买的折扣券是实现这一目标的绝佳方式。

当订单总价高于 100 美元时，以下脚本将在感谢页面末尾添加文本。

 add_action('woocommerce_thankyou', 'QuadLayers_thankyou_order', 10, 2); 
函数 QuadLayers_thankyou_order($order_id){
    $order = wc_get_order($order_id);
    $总计=0；
    foreach ($order->get_items() as $item_key => $item ):
        $item_data=$item->get_data();       
        $item_total=intval($item_data['total']);
        $total+=$item_total;        
    结束；
    如果（$总计> 100）：
        echo "<p>您的订单金额超过了 100 美元的范围，因此您可以在下一次订单时获得一张特别优惠券。</p><p>别担心，它会一直有效，直到您决定回来!</p><p>在您的下一个订单中使用以下优惠券<code>[RTC_discount]</code>可获得33%的特别折扣</p>";
    万一;
}

在此示例中，我们选择了 $100，但请确保您将第 8 行中的值 - if($total>100): - 调整为对您的业务有意义的值。

以指定的总购买价格提供优惠券

5) 删除和编辑感谢页面上的订单详细信息

现在让我们看一个更复杂的示例并对thankyou.php模板文件进行一些更改。如果您不熟悉编辑模板文件，可以查看本指南。

在以下示例中，我们将从订单页面中删除电子邮件、总金额和付款方式，因为它们也会显示在订单详细信息中。这意味着我们只会留下订单 ID 号和订单日期。

同时，我们将订单详情列表移至顶部并编辑了标签。

为此，请按照上一节中的说明在您的子主题上创建一个thankyou.php文件，并将以下代码粘贴到其中：

 <?php 定义（'ABSPATH'）|| 退出;?>
<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( '很遗憾，由于发起银行/商家拒绝了您的交易，您的订单无法处理。请尝试购买再次。'，'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= "按钮支付"><?php esc_html_e('支付', '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('我的账户', 'woocommerce' ); ?></a><?php endif; ?></p>
<?php 其他：?>
<p class="woocommerce-notice woocommerce-notice--success woocommerce-thankyou-order-received"><?php echo apply_filters( 'woocommerce_thankyou_order_received_text', esc_html__( '谢谢。您的订单已收到。', 'woocommerce' ), $订单); ></p>
<?php do_action('woocommerce_thankyou', $order->get_id()); ?>
<ul class="woocommerce-order-overview woocommerce-thankyou-order-details order_details">
<li class="woocommerce-order-overview__order order"><?php esc_html_e( '订单号ID:', 'woocommerce' ); ><strong><?php echo $order->get_order_number(); // phpcs:忽略 WordPress.Security.EscapeOutput.OutputNotEscaped ?></strong></li>
<li class="woocommerce-order-overview__date date"><?php esc_html_e('Date:', 'woocommerce'); ?><strong><?php echo wc_format_datetime( $order->get_date_created() ); ></strong></li>
</ul>
<?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__( '谢谢。您的订单已收到。', 'woocommerce' ), null );>
</p><?php endif; ?>
</div>

如果一切顺利，您应该会看到如下内容：

在感谢页面上删除和编辑订单详细信息

结论

总而言之，感谢页面经常被忽视，但它会对您的业务产生重大影响。通过为将来的购买添加推荐链接、独家优惠和折扣，您可以增加销售额并增加回头客的数量。

在本指南中，我们看到了两种以编程方式编辑 WooCommerce 感谢页面的方法：

带挂钩
覆盖模板文件

这两种方法都很有效，并且可以在不同的情况下工作，因此请选择最适合您特定要求的一种。

到目前为止，您应该能够自定义您的感谢页面，并且：

添加自定义内容，例如社交媒体链接
展示产品
显示帐户详细信息
当客户达到一定的最低消费时给予折扣
删除和编辑订单详情

最后，请注意，在 WooCommerce 模板文件上定义的相同钩子是您可以在子主题的functions.php文件中使用的钩子。因此，如果您从模板文件中删除挂钩，它们将停止在您的网站上运行。

有关自定义商店的更多指南，请查看：

如何在 WooCommerce 中自定义商店页面
以编程方式编辑 WooCommerce 产品页面
如何自定义 WooCommerce 我的帐户页面

您是否自定义了感谢页面？您使用了哪种方法？在下面的评论部分让我们知道！