WooCommerce Thank You Page Customizer

Created: 05/11/2018
Latest update: 26/11/2018
By: VillaTheme
Thank you for purchasing our plugin. If you have any questions that are beyond the scope of this documentation, please feel free to request support at our Support Forum. Thanks so much!

What is WooCommerce Thank you Page Customizer?


– Coupon: WooCommerce Thank You Page Customizer will give a coupon after a successful order. You can choose to give an existing coupon or let the plugin generate unique coupons.

  • Existing Coupon: You can choose an existing WooCommerce Coupon to give to customers after they successful order an order.
  • Unique Coupon: The plugin will generate a unique coupon for each order and display it on the Thank You page.
  • Unique Coupon settings: You can set up generated coupons with settings of WooCommerce Coupon.
  • Coupon amount: The coupon discount amount.
  • Discount type: Select the coupon type percentage discount, fixed cart discount, fixed product discount.
  • Email restriction: Make the coupon can be used by the purchased email address email address only.
  • And all other WooCommerce Coupon settings.

– Design:  The plugin allows you to drag and drop elements to build your own Thank You page.

  • Preview: You can select an order to preview your design on front-end.
  • Drag & Drop: drag and drop element to build the Thank you page as you want. Elements include the Thank you message, Order Confirmation, Order details, Customer information, Social icons, Coupon codes, Google map, text…
  • Element Design: Each element has its own design page which allows you to change that element front-end style.
  • Custom CSS: The plugin provides a Custom CSS option allow you to add your own CSS code to change the front-end style of the plugin.

In Dashboard/Plugins/Add New /Upload Plugin/Choose file/ select plugin file zip/ Install Now/Active Plugin

After successful install the plugin, you need to configure some simple settings to make it works.

  • Go to Dashboard/ Woo Thank you page/ 
  • General tab, make sure you have enabled the plugin here.
  • In Coupon tab, select if you want to give an existing coupon to customers or let the plugin generate unique coupon with your given settings.
  • Then go to the design tab to configure the front-end style of the plugin.



  • Enable: This option allows you to turn on/off the plugin.
  • Order status: Usually, the order status will be set to “Processing” after checking out and customers will be lead to a thank you page but it could be different for some payments that you are using. So please select your order status here.
  • Design: A link lead you to the Design of the Thank You page.


In the Coupon tab, you can choose to give to customers an existing coupon or generate unique coupons.

  1. Coupon type: There are 2 types of coupon you can give to customers. Unique coupon (auto-generated by the plugin) or Existing coupon.
  2. Discount type: There 3 type of discount Percentage discount, Fixed cart discount and Fixed product discount.
  3. Coupon amount: The coupon amount you will give to customers in thank you page.
  4. Min order total:
  5. Max order total: Min and max order total help you to create “rules” to give coupons. Example: 10% coupon for orders from $0 to $100 and 20% coupon for orders above $100.
  6. Actions: Click on “Edit” to configure coupon settings of each row, “Clone” to add a new row, “Remove” to remove the current row.

If you click on Edit button, a pop-up will appear. Allowing to change coupons and rules settings


In the General tab, when you click on “Go to Design“, the plugin will direct you to the design page of WooCommerce Thank You page customizer.

  1. Select an order load in preview page.
  2. The layout of the preview page. You can drag and drop element in the Layout area to change its position on front-end.
  3. Click on item on this area to add it into Lay out area.
  4. Custom CSS: you can add CSS code here on change the front-end style.
  5. The preview area. When you change the element style or change the layout style. The change will be applied on the preview area, you can see how will you change look like on front end.

To change a element design, just hover your mouse on that element on the layout area or on the preview page. And click on the pencil icon.

You will be redirected to the design page of that element.

In the picture above, you have the design page if the coupon element with options to change front-end style.


Google Map

Google Map option allows you to add your store address on google map to the thank you page.

  1. Enter your Google map API key, you can learn how to get your API key here.
  2. Enter the address you want to display on the Google Map element.
  3. Type in your address description, this text will be displayed on front, above the google map.
  4. Select a Google Map zoom level.

Elements Design

By clicking on an element, you can go to its design page.

  1. The design area, you can change the color, text, position of each element here.
  2. Shortcodes list, click on this button will open the shortcode windows of the element.
  3. Shortcode windows. This window shows you all the available shortcode of each element.

Extra Information

Thank you for your attention!

If you have any question, please create a topic at our FORUM, we will support within 24 hours.