Thank you page, also known as the purchase confirmation page. It is a part that many e -commerce websites are often ignored Essence Because its main function is to let customers know that their purchase is successful, the owner sometimes rarely pay attention to just show some kind of success information.
However, if you spend some time to optimize it, thank you page for providing more value for you and your customers.
Why do you want to customize your Woocommerce page?
Although your thank you page may look like a small part of your website, every point in the customer journey is to provide more value to shoppers and increase store income. Studies have shown that the cost of retaining existing customers is much lower than looking for new customers. If someone arrives on your thank you page, it means that they have already purchased it. And because they are more likely to make another, this is a good opportunity to guide them to develop in this direction. Just pay a little effort in advance, this new improvement in your store will serve you every day.
In addition, thank you page is a safe place for you to show your customers, instead Send discounts, you may want to limit the number of promotional content.
The following are some methods to improve the store to improve the store:
Including important information related to orders
. Add delivery time estimates so that customers can understand when they receive orders. Or include product guidelines, employment videos, common questions, or links to other support documents. This will help manage expectations, provide the required information and reduce support votes.
Share special discounts.
Including coupons that customers can use in the next order, and recommend related products or affiliated products.
Remind customers’ loyalty points, rewards or subscription status.
Using Woocommerce points and rewards, customers can earn points through purchase, account registration and comments. Thanks to the page is a good place, which can remind them of the points they have received, how far they are exchanged, and how much they earn more points. If you sell subscriptions or member qualifications, thank you page for providing a good opportunity to suggest that you plan to upgrade or remind customers whether their regular payment methods are about to expire.
You can customize it in several different waysThanks for the page. The manual method includes writing a custom page template, which uses the woocommerce hook through the theme functions.php file, and the style table that adds custom styles to the sub -theme. If you are not satisfied with coding, you can use a plug -in to define your thank you page.
The default woocommerce thank you page
The style of the thank you page may be installed according to you The theme is different. It may even use a custom thanks. However, what you see below is the default content contained in the style of the theme application of the Sinatra:
It can be seen that the content is relatively basic. By default, include order numbers, date, customer email, total, payment method, product and bill information purchased. Let us explore some methods that can add some basic customs to improve the thank you page.
Use the expansion program to customize your WOOCOMMERCE thank you page
If the process of manual customization of the thank you page looks tedious, or you are not used to studying the code in depth, then some extensions can be for you for you Create the heavy work of the custom thank you page.
Customized thank -you page extension allows you to create multiple thank you pages. These pages are displayed according to the conditions of the purchased products. These custom -defined thank you pages can display unique titles and descriptions, bills and transport information, cross -sales, additional sales, and any other content you may want to add. Since these are actual pages and not dynamically generated, you can add any Woocommerce or theme short code, embedded videos and add custom text.
You only need to create and format your thank you page, and then choose 123] Product data partially displayed.
You can even display multiple thank you pages for a single product, or select a single thank you page based on priority display. If the customer purchases multiple products in the order and each product has its own thank you page to them, then the page with the lowest priority number will be the displayed page.
Another option of creating a custom -defined thank you page is the custom gratitude and successful page expansion. It has similar functions to the customs page extension, but it can also display the thank you page andShow the built -in social sharing button.
Manually create a custom WOOCOMMERCE thank you page
In this section, we will discuss the three different methods of manual custom WOOCOMMERCE thank you page.
Before starting, make sure you use a sub -theme rather than the father theme. Don’t directly cover the files in Woocommerce or your father’s theme, because these files will be covered in future updates.
Note: If you are not familiar with the code and solve the potential conflict, please select Wooexpert or developers to seek help Essence According to our support policies, we cannot provide support for customs. How to write Woocommerce thank you page template 1st step:
thanankyou.php
page template file
Use the SFTP client or host CPANEL access The files of your website are navigated to
WP-CONTENT/PLUGINS/WOOCOMMERCE/TEMPLES/Checkout
. the file thanankyou.php to your local computer.
Step 2: Use your custom code to edit fankyou.php
file
Open
Thankyou.php
. You can use Windows or Textedit (MAC), but make sure you edit in a pure text mode. To better, the free text editing software specially designed for coding, such as atom.io. Atom.io is a cross -platform text editor that is suitable for Windows, Mac OS and Linux operating systems.
In this example, we will change the text \”Thank you. Your order has been received.\” \”Thank you for ordering us!\” We will also add some information about transportation and make some styles to change the attention of these important information. Original code:
This is edited by we will edit in the child theme templateThe default code.
\u0026lt;p class\u003d\u0026quot;woocommerce-notice woocommerce-notice–success woocommerce-thankyou-order-received\u0026quot;\u0026gt;\u0026lt;php echo apply_filters( \u0026#39;woocommerce_thankyou_order_received_text\u0026#39;, esc_html__ ( \u0026#39;Thank you. Your order has been received.\u0026#39;, \u0026#39;woocommerce\u0026#39; ), $order ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped \u0026gt;\u0026lt;/ p \u0026 gt;
Replace code:
This is the code we will use on the new custom thank you page.
\u0026lt;p class\u003d\u0026quot;woocommerce-notice woocommerce-notice–success woocommerce-thankyou-order-received\u0026quot;\u0026gt;\u0026lt;php echo apply_filters( \u0026#39;woocommerce_thankyou_order_received_text\u0026#39;, esc_html__ ( \u0026#39;Thank you for placing an order with us!\u0026#39;, \u0026#39;woocommerce\u0026#39; ), $order ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped \u0026gt;\u0026lt;/ p \u0026 gt; \u0026 lt; p class \u003d \u0026 quot; thanankyou-note \”\u0026 gt; please not to delivers,for US delivery. Orders outside the United States may take two weeks to 30 days to be delivered and may experience delays due to customs or other current policies that are out of our control. If you have any questions about your order, please contact us at [Email \u0026#160; Protected] \u0026 lt;/p \u0026 gt; After these changes, use the same name to save your files,
fankyou.php
Essence In your SFTP application or CPANEL, navigation to
WP-CONENT/TheMES/Your-Child-Theme
. In your sub -theme folder, you will create two new folders. First, create a folder named WOOCOMMERCE . Create a folder named Checkout in
WooCommerce
folder.
now will be modified
The file was uploaded to the sub -theme woocommerce/checkout folder. CSS custom Please note that we added a new P class called
.thankyou-note
. In our children’s theme
Style.css , we will add some customs to the existing p.woocommerce-notice , and to the new to the new p.thankyou-note
Class adds styles, as shown below:
. Woocommerce-Checkout P.Woocommerce-Notice {font-siZe: 20px; font-w; font-wEight: 800; COLOR: #3857F1;}. Woocommerce-Checkout P.Thankyou-Note {Margin-Bottom: 40px; Padding: 0 0 5px 20px; Border-Left: solid 5px #c4401c; 123] Save your style table and upload these customs to your sub -theme folder.
You should now have a thank you page shown below:
]
Use the hook to customize the woocommerce thank you page template You can also use the Woocommerce hook to add or delete the contents of the thanks in the sub -theme Functions.php file. If you are not familiar with WooCommerce hook, check the WooCommerce document. If you need to complete the list, check the WOOCOMMERCE operation and the filter hook reference page. In this example, we will use a special coupon to use an order to add more than $ 100, which will be displayed below the bill address. In the sub -theme of Functions.php
, we will add the following code:
Add_action (\u0026#39; woocommere_thaankyou \u0026#39 ;, \u0026# 39;coupon_thankyou\u0026#39;, 10, 2 ); function coupon_thankyou( $order_id ) { $order \u003d wc_get_order( $order_id ); $total\u003d0; foreach ( $order-\u0026gt;get_items() as $item_key \u003d\u0026gt; $ item) {$ item_data \u003d $ item-\u0026 gt; get_data ()); $ itm_total \u003d int val ($ item_data [\u0026#39; general \u0026#39;]); $ all +\u003d $ itm_total;} if ($ total;} if ($ ttern;} if ($ ttern;} if ($ ttern;)} ($ total;} if ($ total; unchial;} if ($ total; unchial;} if ($ ttern;)}) echo \u0026 quot; \u0026 lt; section class \u003d \u0026#39;woocommerce-thankyou-coupon\u0026#39;\u0026gt;\u0026lt;h2 class\u003d\u0026#39;woocommerce-column__title\u0026#39;\u0026gt;Congrats! Get 50% off your next purchase!\u0026lt;/h2\u0026gt;\u0026lt;div class\u003d\u0026# 39;tybox\u0026#39;\u0026gt;\u0026lt;p\u0026gt;As a special thanks for spending over $100 with us today, we\u0026#39;d like to give you 50% off your next order of any full priced items in our store.\u0026lt; /p\u0026gt;\u0026lt;p\u0026gt;Use code \u0026lt;code class\u003d\u0026#39;tycoupon\u0026#39;\u0026gt;[ 50special ]\u0026lt;/code\u0026gt;\u0026amp;nbsp;on your next order.\u0026lt;/p\u0026gt;\u0026lt;/div\u0026gt ; \u0026 lt;/section \u0026 gt; \u0026 quot;;;}
Save your changes and upload the modified file to your sub -theme folder.
CSS custom
Please note that we added some of the above operations The new CSS class-part of the class
.Woocommerce-Thankyou-Coupon , a DIV class called .TyBox
and a code class called
.Tycoupon
. Since this is a special coupon, we want to attract people’s attention and add unique styles to help it stand out in the rest of the page. We add these styles to the new custom class in the sub-theme
will bring these custom sub-theme styles to resume the. Upload to your sub -theme folder. As a result, it should be shown below:
Whether you decide to use it Which method is to define your Woocommerce thank you page, you should spend time setting a strategy to provide your best return for your efforts. According to the type of business you operate, you may pay attention to rewards or loyal points, coupons or detailed employment information.
Although the self -defined thank you page is only part of the biggest problem for the development business, they are unique opportunities to provide useful information and targeted marketing information, which can save and make money. Discover more methods of custom WOOCOMMERCE stores.
Open 
