The Spectra Forms block is a powerful block that allows you to create beautiful and functional forms without any coding knowledge.

It comes with a variety of pre-made templates, as well as the ability to customize your forms to your exact specifications.

In our documentation, you will find a complete breakdown of all the available controls and settings for forms so you can create nice-looking forms for your website.

Forms Block in Spectra

By using Spectra’s Forms block, you do not have to depend on any Contact Forms plugin to add forms on your website.

You can just insert the Form block on the page where you want, select the Variations, style your form, and you are ready with a form on your website!

Here are some of the features of the Forms Block in Spectra:

• Pre-made templates: The Forms Block in Spectra comes with a variety of pre-made templates that you can use to create your forms quickly and easily. These templates cover a wide range of purposes.

• Customization: The Forms Block in Spectra is highly customizable, so you can create forms that look and behave exactly the way you want them to. You can change the colors, fonts, and layout of your forms.
• Advanced Fields: Advanced form fields are those that go beyond the basic text fields, radio buttons, and checkboxes. They can be used to collect more complex data from users or to make forms more user-friendly and interactive. Some examples of advanced form fields include: File Upload, Date Picker, Signature fields, etc.

Types of Forms

You can create any type of form with Spectra’s form block by simply adding the fields that you want but still, we offer a variety of form templates that you can use to collect information from your website visitors.

Here are some of the most common types of forms that you can create with Spectra:

• Simple contact form: A simple contact form is a form that allows visitors to your website to contact you with their questions, feedback, or concerns. It typically includes fields for the visitor’s name, email address, and message.
• Newsletter form: A newsletter form is a form that allows visitors to your website to subscribe to your newsletter. It typically includes fields for the visitor’s name and email address.
• Suggestion form: A suggestion form is a form that allows visitors to your website to submit suggestions for improving your website. It typically includes fields for the subject of the suggestion and a brief description of the suggestion.

How To Create A Contact Form

Now that we understand more about why you might want to use Spectra forms, let’s look at how you can create one in a few simple steps.

Note that for this tutorial, we’ll assume you already have Spectra installed and activated on your website.

Once you have Spectra installed on your site, you can simply follow the steps below.

1. Add the Spectra Forms Block

To get started, navigate to the page or post where you want to insert your contact form. Then, click on the + icon at the top of the screen.

This will launch the Spectra interface. From the blocks on the left, search for and select the Form block.

2. Set up your contact form fields

Once you have added the contact form block to your page, you can start setting up the form fields.

• Edit the basic form fields: You can edit the basic form fields by clicking on the block and customizing the text. For example, you can change the label for the Name field to “Your Name” or the placeholder text for the Email field to “Enter your email address.”
• Add additional fields: If you need to collect additional information from your visitors, you can add more fields to the form. To do this, click on the “+” icon and select the type of field you want to add. For example, you could add a field to collect the visitor’s phone number or a field to collect their mailing address.

3. Configure Your Form Submissions

After you’re finished creating the form fields, the next step is to configure your form submission settings. You can navigate to the Actions tab under General Settings to access various options.

For example, you can input your email address in the To field where you want the submissions delivered. You can enter multiple email addresses if you wish.

You can also customize the subject of the email and message. When you’re done configuring all of the options, make sure to save your changes.

4. Add reCAPTCHA to Spectra Forms

The reCAPTCHA option in Spectra Forms allows you to add reCAPTCHA to your forms to help protect them from spam and abuse. reCAPTCHA is a free service from Google that uses a variety of methods to verify that the form is being submitted by a human, not a bot.

To use reCAPTCHA with Spectra Forms, you will need to create a reCAPTCHA account and generate a site key and secret key. Once you have these keys, you can add reCAPTCHA to your forms.

5. Customize Your Contact Form Messaging

If you want to further personalize your contact form, you can do so by enabling custom messaging. You can navigate to the General tab under General Settings to access various options.

There are two types of messages you can modify:

• Success Message: this appears once a user submits the form
• Error Message: this will come up if there’s an issue during the submission process

You can customize these messages to match your brand’s voice and style. For example, you can modify the wording to add a bit of personality.

6. Styling Your Spectra Contact Form

Once you have the basic text and fields of your form taken care of, you can begin styling the design of your Spectra contact form.

For example, you may want to make sure that it matches your branding.

So you can click on the Style tab.

Here, you’ll find a wide variety of options and settings that you can use to customize the design of your contact form.

For instance, you can adjust the spacing and padding, as well as change the colors, size, labels, and buttons.

7. Save and Publish Your Form

When you’re satisfied with the look and contents of your Spectra contact form, the only thing left to do is to save and publish it.

You can do so by selecting the Publish button at the top right side of the screen.

That’s it!

Then you can preview your contact form on the front end to confirm that it looks as you want it to.

We hope this article has been helpful. If you have any questions, please feel free to leave a comment below.