CartFlows Block Editor Blocks

CartFlows now includes native WordPress blocks, making it easier to build and customize your funnel steps using the Block Editor.

These blocks are designed to streamline the funnel-building process and are categorized into blocks available in both the Free and Pro versions.

Available Blocks

You’ll find dedicated blocks for each CartFlows funnel step:

• Next Step Button / Link Block
• Opt-in Form Block
• Checkout Form Block
• Upsell & Downsell Offer Blocks (includes variations and Accept/Reject options)
• Order Review Block (for Thank You page)

Note: Each block only appears within its relevant funnel step in the editor. For example, the Next Step Button block will only show when editing a Landing Page.

Step-Wise Breakdown of Blocks & Settings

1. Landing Page – Next Step Button Block

This block allows you to guide users to the next funnel step.

• General Tab: Adjust alignment, add icons, and customize text.
• Style Tab: Modify block and text colors, padding, margins, and icon styles.
• Content Tab: Customize font size, typography, and content styling.
• Advanced Tab: Add custom links or apply custom CSS for further control.

2. Opt-in Page – Opt-in Form Block

Use this block to collect lead information.

• General Tab: Control the primary color and global typography.
• Input Field Tab: Style input fields including color, alignment, and typography.
• Submit Button Tab: Customize the appearance of the submit button.
• Additional Tab: Add custom CSS to personalize the design.

3. Checkout Page – Checkout Form Block

Designed to handle everything from product details to payments.

• Layout Tab: Choose between One-Column, Two-Column, or Two-Step layouts.
• Global Tab: Set global colors and typography for the entire form.
• Heading Tab: Style headings within the checkout form.
• Input Fields Tab: Adjust the look and feel of form fields.
• Button Tab: Design checkout and continue buttons.
• Payment Section Tab: Control the design of the payment methods section.
• Success/Error Messages Tab: Style messages that appear after submission.
• Product Options Tab: Customize how product variations are displayed.
• Order Bump Tab: Style and manage the Order Bump layout.
• Additional Tab: Add custom CSS for advanced tweaks.

4 & 5. Upsell & Downsell Pages – Offer Blocks

These pages support product variations and feature dynamic Offer Blocks for streamlined offer handling.

Available blocks for the Upsell & Downsell Pages :

• Offer Accept/Reject Button
• Offer Accept/Reject Link
• Offer Product Title
• Offer Product Price
• Offer Product Description
• Product Variations
• Quantity Selector

All content is dynamically rendered based on the offered product.

6. Thank You Page – Order Review Block

This block is used to display post-purchase information and order details.

• General Tab: Show or hide order review sections.
• Spacing Tab: Adjust spacing between headings and sections.
• Heading Tab: Style the heading text and typography.
• Section Tab: Customize the text, colors, and fonts for each section.
• Order Review Tab: Manage order item styling.
• Downloads Tab: Display and style downloadable product info (if available).
• Order Details Tab: Customize text and design for order metadata.
• Customer Details Tab: Style billing and shipping details.
• Additional Tab: Add custom CSS as needed.

These Gutenberg blocks give you full control over the design of each step, without needing shortcodes. However, if you are using another page builder, you can continue using it with guidance from our dedicated documentation on shortcode placement.