Design Funnel Steps Easily

  1. Home
  2. Docs
  3. Funnel Planning And Mappi...
  4. Checkout Step Configuration Options

Checkout Step Configuration Options

In this doc, I will show you how you can configure your funnel Checkout page.

I assume that you have already have created a Landing and a Checkout step.

WPFunnels Canvas

If you haven’t added any product to your funnel yet, you will see a red warning message “No Product Added” on the Checkout step.

Add a new product to your Checkout

Now, to add a product to your funnel checkout, click on the Checkout step, and you will get a few new options.

WPFunnels Checkout Step

The first option is the Settings, the second option will let you View the Checkout page in action, the third option is the Edit option, through which you can edit your Checkout page. And the last option is Configure option.

From here click on the Settings option and you will get the options to add a new product to your Checkout page.

Once you click on the Settings option, you will get the following view:

WPFunnels Checkout Settings

Here, you will see that Products tab is selected by default.

On the right, you will find a search box.

Type the product name and you will get suggestions, and select your preferred product from the list.

WFunnels Search New Product

After choosing the product, click on the Add Product button to add this product to your Checkout.

WPFunnels Add Product

Once the product is added to your funnel, you will have the option to change the quantity of your product from the quantity field.

Also, you can add more products the same way. Search for a product and select the product from the list and then click on Add Product button, and the products will be added to your funnel.

Now, finally, click on the Save Changes button.

WPFunnels Checkout Settings Save Changes

Adding an order bump to you Checkout page

If you want then you can add an order bump to your checkout, and to do so, click on the Order Bump option from the Settings tab.

Click on the Enable Order Bump checkbox and you will find all the options to configure your order bump product.

WPFunnels Checkout Order Bump Settings

From here you can add an order bump to your checkout page, change the order bump style, description, quantity, discount, etc.

Make the changes as you want, and then click on the Save Changes button, and now you can see the order bump on your Checkout page.

WPFunnels Order Bump Save Changes Button

Edit the design of the Checkout page

Now, to change the layout/design of your Checkout page, go back to the funnel canvas, click on the Checkout step, and then click on the Edit option from the top of the Checkout step.

WPFunnels Checkout Page Edit Option

Once you click on the Edit option, a new tab will open with the Elementor page builder plugin through which you can edit your Checkout page.

I should mention that, here, I’ve set Elementor as the default page builder, this is why this Landing page will open with Elementor. You can change the default page builder from the WP Funnels Settings.

Once the page is open with Elementor, you will get the following view:

WPFunnels Checkout Page Edit With Elementor

Also, if you are using a pre-made template, then you will get the Checkout layout here and you can make any changes as you want.

WPFunnels Pre-made Checkout Layout Edit With Elementor

On the left, you will get a list of widgets that you can simply drag and drop on your editor, and then edit the widget.

Also, you can search for a widget on the search bar.

WPFunnels Checkout Page Edit With Elementor

To add the Checkout option to your page, scroll down to the bottom of the widget bar and find WPFunnels, or search for Checkout widget.

WPFunnels Checkout Widget of Elementor

Drag the Checkout widget and drop it on your editor.

WPFunnels Drag and Drop Checkout Widget in Elementor

Click on the Update button and all the changes will be saved.

WPFunnels Checkout Page UPDATE Button of Elementor

Your checkout page is ready.

Now, finally, to see your checkout page in action, select Checkout step from your can click on the view option next to the UPDATE button on Elementor, or you can go back to your funnel canvas, select Checkout step and then click on the view option.

How can we help?