WooCommerce Product Pre-Orders


Created: 03/02/2021

Updated: 03/02/2021

By: VillaTheme

Thank you for using 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!

Firstly: Enable Pre-orders feature for products on your website.

 

  • Go to Dashboard/ Pre-Orders, enable Pre-orders on front end to use this feature
  • Customize Add to cart text as you want, by default, it will be “Pre-Order Now”
  • Customize messages when pre-order products have and don’t have availability date and time.
  • Design for Pre-order text buttons: on single product page, shop page, cart page.

 

Secondly: Set information for pre-order products.

For simple products:

 

For variation products:

  • Go to product editing page, click on Pre-Order option (For simple products) then Pre-order section will appear in Product Data meta box. Or go to Variations (For variation products), click on Pre-Order option in each variation.
  • Add pre-order information for a product including: Pre-order date, Pre-order label, Availability date label, No date label, Pre-order price/charge. (You can see how to set price for pre-order products here)
  • Update product.

 

Now pre-order products have been created on your site, you can check on front end

  • On shop page:

 

  • On Single product page:

 

 

On Cart page:

On Checkout page:

 

 

 

 

General

1. Enable Pre-Order on frontend: Uncheck this option to disable Pre-Order features on Frontend

2. Price calculation: Enable this option, Pre-Order price will be calculated based on the sale price.

3. Default Add to Cart text: This text will be replaced on ‘Add to Cart’ button. By leaving it blank, it will be ‘Pre-Order Now’.

4. No date message: Text is displayed when the Pre-Order date is empty.

5. Default availability date text: Text message when Pre-Order date is availble. By default: Available on:{availability_date} at {availability_time} , Available shortcodes: {availability_date},{availability_time}

6. Variable product label: The label which will be showed when all variations of a variable product are Pre-Order.

Design

1. Color on single product page: Change the color of the ‘availability date’ and ‘no date’ messages on the cart page.

2. Color on shop page: Change the color of the ‘availability date’ and ‘no date’ messages on the shop page.

3. Color on cart page: Change the color of the ‘availability date’ and ‘no date’ messages on the cart page.

Set Pre-Order information for Products

A. For simple products

Step 1: Go to Products > All Products, add/select a simple product you want to sell pre-order, go to the product editing page.

Step 2: Select Pre-Order option, then Pre-Order section will appear in the Product Data meta box

Step 3: Set Pre-Order information for product.

1. Pre-Order option on the editing page of a simple product.

2. Pre-Order section that will appear when Pre-Order option selected.

3.  Pre-Order date: Set date and time when this pre-order product available.

4.

5.

6. No date label: Customize the text when this pre-order product has not had availability date and time

7. Manage Price: Customize pre-order price of product. It can be: Set to a specific value; Increase/Decrease price by a fixed or percentage amount.

8. Set pre-order price to a specific value: Set to a fixed value for pre-order product price. Go to (13.) to add value.

9. Adjust to decrease pre-order price: Decrease price based on the current regular price or sale price of this product (*) by a fixed (11.) or percentage amount (12.). Go to (13.) to add value.

10. Adjust to increase pre-order price: Increase price based on the current regular price or sale price of this product (*) by a fixed (11.) or percentage amount (12.). Go to (13.) to add value.

* There is an option to change which price will be based to calculate pre-order price, in the General > Price calculation.

 

B. For variable product.

 

Step 1: Go to Products > All Products, add/select a variation product you want to sell pre-order, go to the product editing page.

Step 2: Go to Variations section in the Product Data meta box, then select Pre-Order option.

Step 3: Set Pre-Order information for product variations the same as for  a simple product.

 

 

Display and Filter Pre-Order Products on Product Admin Page

Go to Product admin page, you can easy filter products that have pre-order status and observe pre-order date of products.

Display Pre-Order Products on Order Admin Page

Go to Order admin page, you can observe which orders that have pre-order products.

EXTRA INFORMATION


Thank you for your attention!

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