Use a Form’s Style Everywhere (for Free!) with Forminator’s Global Appearance Presets

Maintaining the same form styles and appearance across all of your forms has never been easier with Forminator’s Global Appearance Presets.

The look and style of a form you create with our free plugin, Forminator, can be replicated and used for all of your forms. Even change existing forms to your new style and appearance with a click of a button!

This article shows you how it’s done. We’ll be covering how to…

Using a form to your specification across multiple platforms is excellent for branding, saves you time, and helps manage your form creation as simple as possible.

Let’s get to it!

Update the Default Preset

Forminator starts from scratch with its Default preset. Before we dive into making new presets, here’s a look at how you can change the default settings.

The whole process begins in Settings and Appearance Presets. You’ll see at the top of the page an area called Preset.

A look at the preset dropdown.
This Preset dropdown is what shows up first.

The preset design that pops up is Forminator’s Default Preset.

The default design style
This is the blank slate of style for your form.

Underneath this, jazz things up for the default design. You have your choice of any Color, Hundreds of Fonts, Form Container, and even Custom CSS.

Check out all of the configurations options in our documentation and below…

There are a TON of configuration options.

When you have it edited according to your configuration, hit Update – and that’s it! We’ll talk about how to apply it to all of your forms and more coming up in this article.

Create a New Preset

Let’s say you want to create a new preset and leave the default one alone. Or, you decide to change the default configuration and make a new configuration. Either way – it’s simple to do!

We’ll head back to the banner on the top of the Settings and Appearance Presets web page. From there, it’s just a matter of clicking on the plus sign for a New Preset.

Where you add a new preset.
New Preset is a click away!

You’ll first give the form a Preset Name.

Where you create a preset.
This window will appear after hitting New Preset.

Additionally, you can import the style from an existing form that you created by clicking the Import Style From Form dropdown. It’s up to you.

List of created forms.
All of my current forms are displayed.

We’ll create a new preset for this example and name it Preset One. Once named, you’ll hit Create Preset.

Where you create a preset.
Name the preset anything you’d like!

After that, you’ll see the new preset in the dropdown.

The preset dropdown.
All of your presets will be shown here.

And that’s all it takes. If needed, you can access it at any time to edit.

All of your presets will appear in the dropdown. You can create unlimited amounts of presets as you want!

Apply Your Preset to Multiple Forms in Bulk

There are several ways to apply a preset to multiple forms – either in bulk or individually. All of this is done from Forminator’s dashboard under Forms.

Let’s say you want to apply a preset to ALL of your forms. That can be done in just a few clicks. Simply click the checkbox to the left of the dropdown, and click Apply Appearance Preset.

This updates all of the forms at once.

After choosing your bulk action, you’ll select which preset you’d like to apply. Select the one you’ll use from the dropdown, click Apply Preset – and you’re done.

Where you choose a preset
All the presets created will show in the dropdown.

Additionally, you can check only certain forms to apply the appearance preset. The choice is yours!

Add Preset to Individual Form

You can use the method I just touched on with bulk by checking the box to the form you want to change. However, there’s another option.

Each form has a Gear icon. When clicked, a dropdown appears of various functions (e.g. preview, duplicate, etc.). One of those options is Apply Preset.

The gear icon
All of your forms will have the gear icon.

Just like with bulk presets, you’ll choose which preset form you’d like to apply. The preset will then be applied to that individual form.

Looks and Style at Peak Per-FORM-ance

As you can see, it’s as easy as ever to apply Forminator’s Global Appearance Presets to all or individual forms. It makes branding and form creation much more manageable than starting from scratch with each new form you create.

This keeps the style of your form and looks consistent throughout, no matter where you’re using them.

If you haven’t yet, be sure to start using our Forminator plugin to implement this useful feature and check out the documentation if you need help. Forminator is free to use, with over 200k active installs and a solid 5-star review.

Keep your forms on form!

Creating the Perfect Contact Form with Forminator

Contact forms not only let visitors get in touch with you, they are also essential for lead generation. With our free 5-star Forminator plugin, adding a contact form to your WordPress site is easy, as this guide will show you!

This tutorial will demonstrate how to set up the perfect contact form and create the ability for visitors to reach you (and reach back out to them) in just a few clicks.

Here are the areas that we’ll be covering:

  1. Create Contact Forms Faster Using Time-Saving Templates
  2. Customize Forms to Suit Your Needs by Adjusting Their Appearance
  3. Control the Behavior of Your Form for Maximum Performance
  4. Set Up Email Notifications for Instant Alerts
  5. Advance Forms Further by Integrating with Popular 3rd Party Apps
  6. Control Your Data Storage to Your Standards in Settings
  7. Separate a Form Perfectly with Pagination
  8. Preview and Easily Implement Your Form Using Shortcodes

A new form is a cinch with Forminator. Let’s get started!

1. Create Contact Forms Faster Using Time-Saving Templates

With Forminator’s premade templates, just click Contact Form, name it, hit Create, and it will be set up for you immediately.

Templates in Forminator.
Click this button, and let’s create a contact form for your site.

This form comes with all the essentials a simple contact form needs: First Name, Email Address, Phone Number, Message, and Send Message.

Contact form fields.
Use the default fields to instantly create a basic contact form.

You can add more fields and edit accordingly. However, if this serves its purpose, just click Publish, and Forminator delivers a shortcode for use on any WordPress page, post, or acceptable widget.

Creating a contact form with Forminator is quick, simple, and easy!

Forminator automatically syncs with your admin email, so when users opt-in, you’ll get notified.

You now have a form that’s ready to collect information and be used on your website. It’s that simple.

 2. Customize Forms to Suit Your Needs by Adjusting Their Appearance

Forminator gives you a lot of flexibility when it comes to adjusting the appearance of your contact form with colors, fonts, custom CSS, and more.

The Design Style area comes with a pre-made style.

The design style area.
Pick Forminator’s premade designs or jazz it up with some CSS.

You can adjust the Design Style with options like Default, Flat, Bold, Material, or you can opt for None.

Pick the style that works best for your contact form.

From here, you can change the colors in the Colors section. This is where you can customize it perfectly to fit your color palette on your website.

Adjust the colors on many elements of the form, such as the form container, submission indicator, field basics, and more. Or use the default colors.

Various color options.
Color options are endless when it comes to customizing your form.

Click on an individual element to change its colors.

Add custom colors to any form element.

Similar to the colors, you can change many font levels in Fonts. Forminator’s font options include inheriting the theme’s fonts, or you can customize these.

The fonts area.
Match your brand’s fonts throughout the entire form.

Any of these fonts can be overwritten with custom ones by Google Fonts. You can also change the font size and weight.

Choose from hundreds of fonts.

You can also customize your form container’s border and padding in the Form Container area.

Beyond that, you can adjust the radius, thickness, and style. Also, in the Spacing area, you can adjust the spacing with options of Comfortable, Compact, or Custom — where you’ll enter your spacing in pixels.

The form container where you can adjust spacing.
Need more space? The border and spacing can be customized however you’d like.

You can also add custom CSS for more advanced modifications.

3. Control the Behavior of Your Form for Maximum Performance

Your contact form’s behavior is how your form functions while a user is filling it out and when the user hits submit.

Being able to edit and modify key points any way you’d like puts you in control of your contact form’s behavior.

To start with, you can adjust the Submission Behavior. Modify submission behavior with an Inline Message, Redirect to a specific URL, or Hide Form upon submission.

You can also customize the message and set the time (in seconds) to auto-close the success message (which indicates the form was submitted okay).

Submission behavior section.
Add a personalized message to your users.

Forminator allows you to choose your Method of reloading the page. You can use AJAX to send the form without reloading the page or reload the page.

The Validation method is for fields that you’ve chosen to validate. This feature shows how these will behave when a user submits, whether to run validation checks when the user submits the form using Ajax or on the server-side using PHP, and returning any error messages after a page reload.

Also, there is a Submission Indicator feature that shows the loader if activated.

The method of submission including validation and submission indicator.
Keep users in the loop by letting them know that the form will be submitted.

There are also options for enabling Autofill, Security (Honeypot protection and logged in submissions only), and the Lifespan of a form.

Lifespan allows your form to expire on a specific date or after a certain number of submissions.

The Autofill area.
Make it easy to submit a form with Autofill.

4. Set Up Email Notifications for Instant Alerts

Customize email notifications for your admin and site visitors in just a few clicks with Email Notifications.

You can create emails that get delivered to your admin team or any specified email addresses when a form is submitted.

There are also advanced options for CC Emails, BBC Emails, Reply-to Emails. Plus, you can add conditions based on user input and rules for additional customization.

Where you add email notificaitons.
Get a notification the way that you want it when a new form is submitted.

5. Advance Forms Further by Integrating with Popular 3rd Party Apps

You can send a specific form’s data to a connected 3rd party app, such as MailChimp, FortressDB, Slack, and more. It’s all done right in Forminator’s dashboard.

Forminator will show you a list of connected apps that you have available; from there, you can activate it to connect with the form by hitting the plus sign and Activate App.

The Integrations area.
All contacts from a form can go directly into MailChimp.

Every app will have different prompts to get it to synchronize and will walk you through exactly how to do it. Once finished, your form will sync with the app, and it will work accordingly.

You can connect and disconnect from any 3rd party app at any time.

3rd party apps are perfect for continuing marketing through email providers, storing information on the cloud, and much more.

6. Control Your Data Storage to Your Standards in Settings

With Settings, you can control the Data Storage by disabling any submissions in your database. All submissions are stored by default if not enabled.

You can also customize how long you’d like to retain the form’s submission for a specific amount of time in the Privacy settings.

Finally, there are options for handling account erasure requests and keeping files that are submitted if the form gets deleted.

Settings area with data storage and privacy settings.
Data storage controls have never been more straightforward.

Edit data storage in Forminator’s global privacy settings at any time.

7. Separate a Form Perfectly with Pagination

Add pagination to your form to break it up into individual sections. Pagination leaves the style not as cluttered looking, which is beneficial if you have a lot of fields that are required.

Simply add the Page Break field, and Pagination will appear on top. You can then insert page breaks in between various fields and separate the form however you’d like.

You can adjust the Progress Indicator, Buttons Text, and the Labels.

Once completed, your users will go step-by-step through the form.

Use pagination to break up complex forms.

8. Preview and Easily Implement Your Form Using Shortcodes

Does your form look good? Hit Preview any time to get a glimpse of it and try it out…

Preview and test your new contact form.

As mentioned at the beginning of this article, when you’re ready, once you hit Publish on your new contact form, Forminator provides you with a shortcode that you can paste into WordPress pages, posts, or acceptable widgets to display your form.

A look at Forminator's shortcode.
Forminator’s shortcode gets the “thumbs-up”.

You can always access the shortcode in Forminator’s admin. Along with that, you can change, edit, and adjust your form at any time and the changes will automatically propagate throughout your site wherever you have added the form via the shortcode.

And Like That, It Forms

With all the elements in place, you can have your contact form up and running in no time.

The perfect contact form will contain information that is required to serve your purpose. With Forminator, you can adjust a form exactly how you want to ensure it functions perfectly for your WordPress site.

You can view more about constructing contact forms and also about getting started with them.

Speaking of contact forms, be sure to use ours to reach out to our 24/7 support team superheroes if you ever have any questions and need to contact us.

And to keep tabs on what’s coming up with Forminator, check out our Roadmap any time.