Create, build and design forms
In this article, we'll guide you through the essential steps to create a form, customize the structure, and add questions.
Creating a new form
Creating a new form using the Form Builder is almost as easy as clicking a button!
Select + Create New Form and a pop up will appear asking you to enter a name for your form. This name is only visible to your team, and is not customer facing, so just make sure the name you choose is clear so your teammates know which particular form you are creating.
Once you have entered a name you can click Create Form, and you’re ready to start building
Building a new form
Once you have created your draft form, you can start to build it out and customize! For example, you may like to include a customer-facing title and description at the start of your form, before adding your question blocks.
Your new form will also have a templated “thank you” page, which is placed at the end of your form. You can customize this as needed.
And now you’re ready to start adding some questions!
Adding questions to your form
To start adding new questions to your form, simply click on + Add Block. This button can be found at the bottom of the draft page you’re working on.
When you click on this button a new panel will appear from the right of the page. This panel contains an extensive selection of different question types you can add to your form.
The question types available to you are listed in the table below.
Select the question type you’d like to add to your form, and then fill in the required details, such as the question text.
Mark your question as required (or not) by moving the toggle left or right.
To add a description to your question, or placeholder text, select the three ellipses in the bottom right-corner of the question block.
Once you’ve filled in the question details, you’re ready to move on!
Designing forms
Are you ready to master form design with our Form Builder? This article will guide you through two important sections: creating a new page and designing your form.
Creating a new page
You might like to group questions that cover similar themes or topics onto the same page. To add a new page to your form select the + icon next to the PAGES heading in the right, side panel.
You can rearrange pages by dragging and dropping them as needed, and any changes made in the Form Builder, will be reflected in the side panel as well.
Designing your new form
Once you’ve finished building out your new form you can move onto the design and choose your fonts, logos, colors, and more. You can even add custom CSS if you want something personalized to your brand.
To start designing your form, select the DESIGN tile.
In the right-hand panel you can choose the following design elements:
- Font
- Title and text alignment
- Colors
- Background image
- Logo
If your brand guidelines require further customization than fonts and colors, you can navigate to the Advanced tab to add custom CSS where instructed.
To make it easier to add custom CSS, you can use the class names below for each question. These class names will be applied to the top level card, elements inside can be targeted using CSS.
Each question/content block will have the following class names:
- [.code]lx-override--id_<unique id>[.code] to target a specific question.
- [.code]lx-override--type_<block type>[.code] to target all questions of a type.
- [.code]lx-override--question[.code] for all question blocks.
- [.code]lx-override--content[.code] for all content blocks.
- [.code]lx-override--finish[.code] for the finish page message
Once you’re done you can move onto your settings. Read more about forms settings here.
What's next?
Lexer’s Form Builder is the ultimate way to create forms and surveys to capture zero-party data directly from your customers. To learn more about access and pricing, you can find more detail here. If you would like any help, reach out via the chatbot in the bottom right hand side of the page. We have heaps more content that showcases Lexer's Form Builder. You can see the full list of Forms content here.
