2 Step Form

Collect shipping and payment info in one template

Choose this form option if you want to quickly add customer information fields, billing options, a purchase summary, and an order bump to the funnel, all with a single template.

Note You can place only one 2 Step form widget (hidden or visible) on a step.

This template has two sections: Shipping and Your Info.

The Shipping section collects customer information (e.g. name, email, etc.). The Your Info section displays product/subscription options and payment gateways. It also has an order bump option.

Note Click a heading (Shipping or Your Info) to customize the section name. (optional)


You can edit or delete any field on the Shipping form. You can also add a deleted field. All fields, by default, have a red asterisk which means they are required.

Edit a field

You can't edit a field on the template. Instead, changes in the settings panel. This is where you customize the design (e.g. margins, background color, etc.) by clicking the Basic or Advanced tabs.

You can also:

  • change field status from Required to Not Required (and vice versa)

  • edit or remove field labels

  • edit or remove field placeholder text

  1. Click a field one time. The side panel displays.

  2. Make changes.

  3. Click Save changes.

  4. Click Preview.

Delete a field

To delete a form field:

  1. Click the field one time.

  2. Click the trash icon.

Adding a template field

If you delete a form field and want to add it back to the template:

  1. Click the plus (+) icon at the top of the form.

  2. Select an option on the drop-down menu. Funnelish adds the field to the bottom of the form.

  3. Drag the field to your preferred location.

Field type

Change field design and input requirements by customizing the Input type. You can change the input type for template fields and custom fields.

  1. Click a field one time. The side panel displays.

  2. Click an Input type. The field in the template changes.

  3. Click Save changes.

  4. Click Preview.

Your Info

Click number 2 to open the second form. This is where you configure products and billing. You can also customize page design with standard tools (e.g. margins, font, background color, etc.).

This form has five key sections that you need to review and customize:

Product List configuration

Describe the products or services on offer. You can also customize order quantities.

  1. Click the Product List field one time. The side panel displays.

  2. Click the Manage Products button. A new panel displays on the right.

Editing products

In the new panel, edit current product information or add new products.

  1. Click a product name to open the product page.

  2. Edit information. (optional)

  3. Click Save changes.

Adding products

  1. Click the Add a new product button.

  2. Complete the workflow to add a one-time product or subscription.

Customizing order quantities

Next to the Select type heading, there are three options to control how much a customer can purchase.

  • Single checkout means a customer can purchase one item of one product or subscription. Bulk purchases are not possible. (e.g. one bag of coffee or one set of cups).

  • Multi-checkout means a customer can purchase one item of multiple products or subscriptions at one time (e.g. one bag of coffee and one set of cups).

  • Multi-Quantity means the customer can make bulk (up to 10) purchases of multiple products or subscriptions at one time.

  1. Go to the Product List settings panel.

  2. Click the button next to Selection type.

  3. Choose an option.

  4. Click Save changes.

Payment Form

This is where you configure payment gateways. We describe the payment form in a different article.

Order Summary

This section shows dynamically generated content to the customer. It's not possible to change the internal structure of this field. However, you can customize the design.

  1. Click the field one time The side panel displays.

  2. Customize settings. (optional)

  3. Click Save changes.

  4. Click Preview.

Order Bump

This handy feature promotes a product just before the customer goes to the checkout. The Order Bump feature is built into the 2 Step form. It's also a standalone widget. We describe how to set up and customize an order bump in a different article.

CTA button

Customize the design of the CTA button at the bottom of the template. You can also edit the button label and text under the button.

  1. Click the button field one time. The side panel displays.

  2. Click Heading to change the button label. (optional).

  3. Click Sub-headline to add a second line of label text. (optional).

  4. Customize label design like color, font, and margins. (optional)

CTA sub-text

The default sentence below the CTA button (100% secure and safe payment) is a separate field. Click the field one time to open the side panel and change the text or add customizations. (optional)

Last updated