Creating and Publishing a Form

Creating and publishing forms is straightforward with SureForm’s intuitive drag-and-drop editor.

In this guide, we’ll show you how to create a complete form without any coding and publish it on your WordPress site.

Let’s get started!

Note: Before we start, please ensure you’ve installed SureForms on your WordPress site.

Adding a New Form

Go to your WordPress dashboard and follow these steps to add a new form:

• Click on the New Form option under your SureForms dashboard.

• You can create a form from scratch or create a form with AI. In this example, we’ll create a new form from scratch:

Adding & Customizing Individual Form Fields

It’s time to add the necessary fields/blocks to our form. Here’s how you can do it:

• Provide a form title to your form.

• Click on the “+” icon to add the preferred block.

• Optionally, you can directly drag any of these blocks from the quick action bar:

• Select the individual field and go to “Block” to access the block-level settings.

Here, we have multiple options available. We’ll show you some of them:

• You can modify the field label directly within the preview.

• Under General > Attributes, you can toggle the Required button to make a field mandatory to fill.
• Under Error Message, you can set the text message that appears when the user tries to submit the form without filling this mandatory field.

Upon doing this, a small asterisk symbol will appear next to the mandatory field.

• These percentage boxes let you adjust the width of the field. You can decide how many columns an individual field takes up. For example, the 75% field width reduces the width of the following field:

Note: All of these settings vary from block to block.

• To delete a block, just select it and press the delete button on your keyboard, or you can click on the three-dot icon and hit “Delete”.

This will delete the selected field.

Form Settings

These are the form-level settings that appear when you click anywhere on the form editor.

Instant Forms are forms you can send directly to someone without adding them to a page or setting up the styling.

• To enable it, click on the Instant Form button at the top-right and enable the Instant Form toggle button.

• You can change the URL of your form by scrolling down a bit here.

• Under General > Email Notification, you can configure the email address where form responses are sent.

• Click on the “edit” icon to configure your email address.

Note: Ensure that you’ve configured SMTP to receive email notifications whenever someone submits your form.

• Under Form Confirmation, you can configure what message users see after submitting the form or which page they are redirected to.

• Under General, you can configure your form labels to appear as placeholders inside the form fields.

This setting will only show up on the front end of the form and not in the editor.

Form Styling

You can customize your forms under the Style tab.

• Under Form Container, you can change the primary color displayed throughout the form.

• Adjust the “Text Color” to change the color of text, labels, form fields, and placeholder text throughout your form.

• “Text Color on Primary” changes the color of text that appears on fields having primary color. For example, the text on the Submit button.

• Adjusts the submit button alignment on the form.

Advanced Form Settings

These are the settings available under the Advanced tab.

• In Anti-Spam Settings, you can enhance the security of your forms with options like Google reCAPTCHA, CloudFlare, or hCaptcha.

• You can customize your form to match your requirements under Custom CSS here.

Publishing & Displaying Your Form

Once you’re done customizing the form, click the Publish button here.

This will publish the form on your site.

Since it’s an instant form, you can share this link with anyone, and they can view and submit their response directly.

That’s all! We hope this article was helpful. Reach out to us for any doubts or questions!