How To Use The Form Builder

Making Collecting Leads A Breeze


Hi, I’m Allie, Our AI powered, training personality.

In the world of digital marketing, forms are one of the greatest players. Forms are how we gather information about clients or prospective clients. If we run an ad campaign, there is going to be a form, if someone wants to sign up to a newsletter, you will need a form, if you want to start an offer on facebook, again, another form. You can see the pattern here.

But where do these forms come from? Someone, somewhere, has to make and implement them, right? Well, Web Geeks marketing platform allows you to do just that. Inside the sites section of our platform nestled away with other various features, we have the form builder. Your one stop shop to making any form you desire. Let’s see how we can use this feature.

Let’s get started,

First, we need to head on over to sites in the left-hand sidebar. Then Up to Forms, and select “Builder”from the drop-down menu. This will take us to the place, where all of our forms are stored. As you can see, i have a couple already.

To start making a form, just click on “add form”. Here we will be given the opportunity to either start from scratch, or create a form from a template. Let’s take a look into the templates route. Our templates section covers a range of different industries, and various types of forms. To view the template, just click on the eye icon at the top corner of the thumbnail. If you like the template, just select “continue”. This template is a very generic form, so let’s go with this.

Now we are inside the form builder, let’s take a look around. As you can see, we have our template with its predetermined fields to start with. Should you want to add in another field, just click the small plus icon, over on the top left. This will bring up a menu with available elements. Currently we have, full name, email, phone and organization. But what if i would like to know this persons address? Well it’s as simple as dragging the element over into the form, like this.

Now, perhaps i am aiming my form at regular individuals, and not businesses? Well, i won’t need this organization field here, so I’ll just click on the box, and click the close button on the top right, to remove the field. You can also insert custom fields, by heading over to the custom fields section, and inserting them from there. And for even more functionality, you can add in customised fields such as images, terms and conditions, html and even captchas. When you add in fields such as these, you will be able to edit them to include the picture you want to use or the html or text you want to insert straight from the field itself. Then you can add further customisations in the right hand menu.

To edit things such as buttons, just click on the button, and you will find a place to add the button text, change the colour of the button, adjust the border, change the corner radius and various other options. To change the overall style of the form, just click on the styles and options button, which is at the top of the window on the far right . Here you can make big changes, such as changing the theme. Just select the theme, then click proceed to change the look and feel of your form. If you just want to make simple changes to the design, you can go to the styles section, where you can change things such as the background colour, border, width and shadow.

Further down, you can adjust the look and feel of the fields, and field labels. You can also insert your own custom css, to make the form look just as you would like it. You can even add in a background and header image. For technical options, just head over to options. Here you can do things such as naming your form. Or customising the user experience, by showing a message after the form has been submitted, or send them to a specified URL. If you are using facebook pixel as a tracking method, you have the space to enter the details here too. Then lastly you can turn a few settings on or off.

Firstly, by clicking sticky contact, you can allow the user to have the form auto filled, based on previous contact information. Then you can make the form use a GDPR compliant font, by turning on the next setting. And lastly you can capture the users time zone information, by turning on enable time zone.

The form builder also has another feature, we call this conditional logic. Conditional logic, is used to direct people with specific answers to either a custom message, a url, or just disqualify the lead. To demonstrate the conditional logic, i am going to add a custom field. Lets go with a budget field, then make this field a required field. Say this form, was a form asking someone how much they could afford to pay for my company’s services. Say my company has a service that costs $4000, but sometimes, we can make an exception and cut down some of the features of that service to make the service $2000. Well, as this field is asking how much they can pay, let’s click on the field and add some conditional logic. To do this, just click the button up here on the top left.

Now, say this customer can afford my services i may want to just direct them straight to my booking page. So under “if”, let’s select the field, then pick “greater than” then I’ll just type in 1999 and underneath, i will type the url of where i want to direct them. Let’s just fill this in, with our home page for now. So i’ll type in “www.webgeeks.com”. Then, i will just click “save”, and close. So now, if the client were to enter any amount from 2000 upwards, they will be redirected to my booking page when they submit the form.

Let’s run a test to make sure. At the top right of the screen, you will find a “preview button”, if we click on this, we will be able to see how the form looks, and how it would function. For the purpose of example, none of my fields except budget are required. So, I’ll just type in a number greater than 1999, let’s go with 6000, then click submit. And here we are, at the Web Geeks home page. All in working order! This was just one example of conditional logic in the form builder. However, there are many other uses and possibilities to suit all of your companies needs! Now that we know everything is working, let’s head on back to the builder.

Now, we are going to save our form, from the top right of the screen. Then you can integrate your form wherever you wish, by clicking integrate. The first thing you will notice here, are the many different ways you can display your form on your chosen page. From a sidebar, to a popup, or inline inside the structure of your page. So pick whatever suits your needs. I am going to click on the “polite side-in option”. Here we have additional settings, such as allowing the user to be able to minimize the form. It’s probably a good idea to use that one. We also have an explanation of how the form functions when integrated, just in case you weren’t too sure, of what the options did.

Then, you can set what triggers the form, such as after the user has scrolled through a certain percentage of the page, or after they have been scrolling for a certain time period, or you can set it to always show. I’ll just go with “always show” for now. Then, i will set the form to “always activated”. Then, you have the deactivation options. I think that deactivating the form, after the lead is collected, is a good idea, so I’ll pick that. Then, for integration purposes, you can either copy the embed code, or copy the link to the form. Then select done.

And that’s all there is to it. You can now go ahead and install this, wherever you need! With the ability to make forms for any purpose with our builder, you will never run out of ways to collect information!

Go ahead, and see how easy it is for yourself! And good luck collecting those leads!