There are two prerequisites before we can work on adding the 2-step order form to the landing page:
Connect a payment gateway:
You can connect payment gateways like Stripe and PayPal with Swipe Pages.
Create an E-commerce store and add products in Swipe Pages:
First, you need to open an e-commerce store in Swipe Pages and then, you have to add products to your E-commerce store.
To learn how to open your E-commerce store in Swipe Pages, click here.
To learn how you can add the product in Swipe Pages, click here
Once you have completed the two prerequisites, it is time to add the 2-step order form module to your landing page.
Like any other module, you can find the 2-step order form module under the modules tab of the left panel. Add it to the funnel page.
To learn more about how to add modules to your landing page, click here
The 2-step Order form module has two parts to it, namely, the form and the order form modules.
Here is how the 2-step order form module would look like:
Components of the 2-step order form module:
The various components of the 2-step order form module are as follows:
Product:
This component has a drop-down menu called Link Product that lists the products that you have uploaded under the product settings.
Please note that you will be able to select only one product per page and sell it using the 2-step order form.
Step Info:
This component allows you to add/modify headings and subheadings for each of the steps.
Fields:
Under the fields settings, you will find the following data fields which are email, Full name, phone number, shipping address, and billing info.
The email field is mandatory and cannot be hidden. But, other data fields such as the full name, phone number, and shipping address can be selectively revealed or kept hidden based on your preference by clicking on the "eye" icon
Billing info, on the other hand, has sub-data fields such as country and zip code.
There is a toggle that allows you to enable or disable the billing info.
Note: If you are using PayPal as your preferred payment gateway, it is imperative to enable Billing info. If not, then the payment will not get processed through PayPal.
You can change the label name to the label name of your choice by simply clicking on the individual data and sub-data fields. Once you click them, a dialogue box opens up where you can modify the respective label names.
Button-text:
This component allows you to add/modify text and sub-text of the button for each of the steps.
Payment methods:
This component allows you to select the payment methods that you wish to use on the 2-step order form.
Order bumps:
This component allows you to add an order bump to the 2-step order form.
There is a toggle that will allow you to enable or disable the order bump.
Here you will find two settings, namely, select product and order bump button text.
The select product allows you to add products set as an order bump in the product settings to the 2-step order form.
Read this article to learn how to set products as order bumps
The order bump button text setting allows you to add/modify the button text present within the order bump button.
Coupons:
This component has a toggle that allows you to enable or disable coupons for the 2-step order form module.
Post payment:
This component has a setting called success redirect.
You can enter the URL of the page, where you wish to send the user after a successful sale is made, in the success redirect setting.
Footer text:
This component allows you to add/modify the footer text of the 2-step order form for each of the steps.
Edit Form labels:
If you are a non-English speaker and wish to change the order form labels form to your native language, you can do so by changing the respective label names within the Edit Form Labels tab.
