SureForms WordPress Tutorial – Design Forms Like a Pro with Gutenberg Block

If you’re looking for a powerful, user-friendly way to create and customize forms directly in WordPress using the Gutenberg editor, SureForms from Brainstorm Force is an excellent choice. In this tutorial, we’ll explore the free version of SureForms, learn how to install it, create forms from scratch, and customize them to fit your needs.


Installing SureForms

1️⃣ Go to your WordPress Dashboard.
2️⃣ Navigate to Plugins → Add New.
3️⃣ Search for SureForms.
4️⃣ Install and activate the plugin.

SureForms is developed by Brainstorm Force, the team behind popular tools like Astra, Spectra, and SureCart.


Exploring the Dashboard

Once activated, you’ll find the SureForms dashboard in your admin panel.
Here, you’ll see:

Form Overview – Current entries and stats.
Related Tools – SureRank, SureEmail, Starter Templates, and Autokit (a no-code automation tool).
Form Creation Options – Start from scratch or use AI.

image

Creating a Form from Scratch

For this tutorial, we’re starting from scratch to understand all customization options before exploring AI features.

Basic steps:

  1. Click New FormBuild from Scratch.
  2. Add a title for your form (e.g., Contact Form).
  3. Use the Quick Block Toolbar to add fields:
    • Text
    • Email
    • Text Area
    • Checkbox
    • Number
    • Dropdown
    • Address
    • Multiple Choice
    • Phone Number
image

Customizing Fields

Each field has unique settings:

Text Field: Add patterns, default values, placeholders, required status, and helper text.
Multiple Choice: Set vertical/horizontal layout, max/min selections, and column counts.
Phone Number: Validate by country to reduce spam.
Address Field: Remove unnecessary lines (e.g., City, Postal Code).

Advanced Options:

✅ Add custom CSS classes to style your form.
✅ Use conditional logic (premium feature).
✅ Insert dynamic values like Site URL or Page Title.

image

Styling & Layout

SureForms integrates with Gutenberg’s grid and group blocks, letting you:

✅ Adjust form width.
✅ Create multi-column layouts (e.g., Name and Email side-by-side).
✅ Change submit button text and primary color.


Form Behavior & Settings

In Form Settings, you can:

✅ Enable GDPR compliance.
✅ Choose email notifications and recipients.
✅ Set confirmation messages or redirect users after submission.
✅ Use Autokit for automation workflows (free version).


Viewing Submissions

Submitted form entries appear in your Entries tab.
From here, you can:

✅ View individual submissions.
✅ Check error logs.
✅ Resend notifications (premium).

image

Why Use SureForms?

Beginner-friendly Gutenberg interface.
Dynamic field options and flexible layouts.
Free version includes essential form elements.
Integrates with automation tools for advanced workflows.

Resources

Download SureForms Plugin
Brainstorm Force Official Website
SureForms Documentation
Gutenberg Editor Overview

Scroll to Top