Step One – Install The Plugins & Configure LaunchFlows Global Options (one time):
If you have not done so already, please install the following plugins:
While most all of the features of LaunchFlows occur inside of WooCommerce and Elementor, we offer a few handy “global” features for modifying the behavior of your WooCommerce site.
We suggest that you setup your LaunchFlows options as shown in this picture. The individual options are further described in our documentation should you want to learn how to set things up for your own custom checkout experience.
Step Two – Create Your First Product:
Now you are ready to start customizing your WooCommerce checkout experience with LaunchFlows.
Step Three – Create Your First WooCommerce Checkout Page:
In order to add custom functionality for a WooCommerce checkout, you must add the WooCommerce checkout shortcode to the post editor.
You can create one global checkout template for all of your products or unique templates for each.
Simply copy & paste the [woocommerce_checkout] shortcode from the LaunchFlows Checkout Template meta box to any post type, then click “Publish”.
If also wish to add custom design to a WooCommerce checkout, you must create and select an Elementor Checkout Template to use with your WooCommerce Checkout Page.
This enables the standard components of WooCommerce to be selectively displayed, positioned and styled as you wish, instead of the standard “one size fits all.”
While still on your new WooCommerce Checkout Page, look to the right side and click the “Add New” link on your LaunchFlows – Checkout Template meta box.
Chose the type of template as “Section”, give it a name, then click “Create Template” button.
Now you are ready to start customizing your WooCommerce checkout experience with LaunchFlows. When installed, LaunchFlows adds two new widgets to Elementor:
- LaunchFlows Components
- LaunchFlows Style Manager
For your first Elementor Checkout Template, add all of the “Required Checkout Fields” components as individual widgets to your layout. Do this by dragging the widget to the layout, then choosing which LaunchFlows component it will display from the the left side controls. Then click “Publish” to save your work.
Finally, apply the Elementor Checkout Template to your WooCommerce Checkout Page by first refreshing the page and then selecting the Elementor Checkout Template from the drop down box. Click “Update” to finish.
Step Five – Create Your First Custom Thank You Page:
Thank You pages can be created directly with Elementor and do not require you to add an Elementor Template separately.
If you use a custom Thank You page for a product, be sure to choose this from the product setup, inside the LaunchFlows tab, with the “Select Thank You Page” drop down option.
Step Six – Add Your Product To The Checkout With The LF-Direct Checkout Link:
Direct to checkout links can be used on your sales pages, social media or anywhere on the web. They will instantly add the appropriate product to your checkout.