WPFunnels

  1. Home
  2. Docs
  3. WPFunnels
  4. 2. Compatibility With Elementor And Gutenberg
  5. 2.2 WPFunnels Gutenberg Blocks

2.2 WPFunnels Gutenberg Blocks

WPFunnels is exclusively compatible with Gutenberg Page editor and comes with its respective blocks to help you create successful sales funnels.

Let us look at all the Gutenberg blocks it comes with.

WPFunnels Gutenberg Blocks

There are 3 exclusive WPFunnels Gutenberg Blocks.

1. WPFunnels Next Step Block

The next step button block is available for landing pages. It allows you to assign the type of funnel you are creating and the next step to a particular landing page.

WPFunnels Landing Page Gutenberg WPFunnels Next Step Block

Here’s how to use it.

First, add the block to the page, and a button will appear.

WPFunnels Landing Page Gutenberg Next Step Button Placed

Next, on block options, you will need choose the button type.

  • Choose Checkout if it’s a sales funnel.
  • Choose Lead if it is a lead generation funnel.
WPFunnels Landing Page Gutenberg Next Step Button Type

Then assign a Button Text. Naturally it is a call to action for a sales funnel.

WPFunnels Landing Page Next Step Button Gutenberg Text

You may also decide the button design.

WPFunnels Landing Page Next Button Style
  • You can set Outline Style as Fill for the button to have a solid filled color with text, or you may set the Outline Style as Outlined to view the button with just the button border and text fill.
  • Change the button fill (or outline) color and the text color.
  • Assign a button radius if needed.

2. WPFunnels Checkout Block

The WPFunnels Checkout Block is available for the checkout page.

Use it to place the checkout fields on the checkout step page, and customize them.

WPFunnels Checkout Page Gutenberg Checkout Block Placed

Here, you have to input or change the following:

WPFunnels Gutenberg Checkout Block Settings
  • Select Layout – Choose if you want the checkout fields to be in 2 columns or one.
  • Order Bump – Option to include an orderbump offer.
  • Billing Section – to customize the design and style of this section
  • Shipping Section – to customize the design and style of this section
  • Order Section – to customize the design and style of this section
  • Payment Section Style – to customize the design and style of this section

If you choose to enable an orderbump, then a few more options will appear under the orderbump options:

WPFunnels Checkout Page Gutenberg Order Bump Options
  • Order bump position – Choose where the orderbump will appear at the checkout.
  • Style – Select the design or type of order bump you want to include
  • Checkbox label – Type in the text that will appear beside the checkbox for the orderbump to be accepted.
  • Product Title – Include a catchy heading to the orderbump offer to be displayed.
  • Product Description – Write a short detailed paragraph about the product and its offer.
  • Select Product Image – Select a preview or promo image for the order bump.

3. WPFunnels Order Details Block

The WP Funnels Order Details Block is available for the Thank you page.

WPFunnels Thank You Page Order Detail Block

Use it to place the checkout fields on the checkout step page, and customize them.

WPFunnels Thank You Page Order Detail Block

Here, you will get the following options:

WPFunnels Thank You Page Gutenberg Block Order Detail Widget Options
  • Enable Order Review
  • Enable Order Details
  • Enable Billing Details
  • Enable Shipping Details

You may enable or disable these options, as per your requirements, to view or not view these details when the buyer is at the Thank You page.

These blocks are very easy to use and important when designing and organizing funnels.

Was this article helpful to you? Yes No

How can we help?