Now that you created a feedback button, it's time to setup your feedback form.
Usabilla allows you to set up two types of feedback forms; a default form for each button and custom form. As the name indicates, the default form pops up once the user clicks your feedback button.
A custom form can be used to override your default form on specific pages. Please see this article for more information on custom forms.
In this article we’ll set up your default form. Setting up a default feedback form is divided three stages: The form editor, in which you can edit the questions your visitors are asked. The Intro screen editor, and Exit screen editor, in which you can edit these respective screens.
We’ll get started with editing your feedback form.
First you can choose a language from the dropdown menu
This will set all the default text of the feedback form to that specific language. Please do mind that questions do not exist for all
The visual feedback setting
Next we can choose the form’s Visual Feedback setting.
This setting will indicate which type of feedback your users can leave through your form. There are 4 options:
Specific or Generic
This option will ask your visitors which type of feedback they want to leave, in the intro screen.
Always Specific
This option will not give users a choice in the type of feedback they leave. They always have to specify a part of your website on which they want to leave feedback.
Always Generic
This option will not give users a choice in the type of feedback they leave. They will not get the possibility to specify a part of your website. Thus their feedback will always be generic. This option also removes the intro-screen from your feedback form. After clicking the button the feedback form will be shown right away.
No visual feedback
This option ensures that no visual feedback is gathered. No screenshots will be taken, and users will not be able to specify a part of the page on which they want to leave feedback. This option also removes the intro-screen from your feedback form. After clicking the button the feedback form will be shown right away.
The Form itself
Next we’ll look at the form itself. In the center of the screen you see the form preview:
At the top of the feedback form you’ll find the rating/mood question. This questions is the most important one, since it gives you a direct insight into the emotional state of your user. Because of it’s important this question is always the first in your form, and cannot be removed.
With the exception of the rating/mood question, all the elements in the form can be re-ordered by using the drag icon:
You can remove, or edit all elements by hovering over them and clicking the remove/edit buttons. All elements have different editing options. You can find a detailed description of all form elements, and their options, here.
With the ‘Form Controls’ menu on the left you can add new elements to your form.
Conditional Forms
Next we have a special element which you can add to your feedback form. The ‘Conditional Forms dropdown’.
This dropdown element allows you to ask your visitor to specify the type of feedback that they’re leaving, and show them alternative follow up questions based on their answer:
You can read more about setting up your conditional forms question here.
Advanced settings
Finally we get to the ‘Advanced’ settings of your form.
There are a couple of important settings in this menu:
The ‘Theme’ dropdown allows you to select the look of your feedback form. By default there are two themes (Default and Star Rating). If you have a custom theme (linkto: customisations article) it will be shown in this dropdown.
The ‘Logo’ dropdown allows you to select a logo that will be displayed as a ‘draghandle’ on the top of your feedback form. By default, only the Usabilla logo is available’. If you have a custom logo, it will be shown in this dropdown.
The ‘Copy feedback form’ menu can be used to copy the elements from an existing feedback form to the one you’re editing now. This is especially handy when using multiple feedback buttons.
In the ‘Labels’ field, you can setup specific labels. The label you fill in here will be automatically attached to all the feedback items that are left through this form.
We’ll look into more elaborately later, so you can leave this blank for now.
Finally the ‘Show Privacy Info’ option. This allows you to add a link to your privacy statement.
Now that you’re finished with setting up your feedback form, click ‘next’ to edit the Intro screen.
The intro screen
The intro screen is the screen that your visitors will see first when they click the Feedback Button. Do not that the intro screen is only shown when:
- Your users can leave specific or generic feedback
- Your users can only leave specific feedback
Both of these options have different intro screens. First we’ll take a look at the intro screen for users who can leave specific or generic feedback:
When you click the ‘Edit’ icon in the top right you can edit the form. This will give you the following options:
Mouse start: This is the text your user sees when he is asked to select a specific part of the website to give feedback about (on desktop)
Touch start: This is the text your user sees when he is asked to select a specific part of the website to give feedback about (on mobile)
Title: adds a title to your intro screen
Subtitle: Adds a subtitle to your intro screen
Specific title: Changes the title of ‘specific feedback’
Specific text: Changes the description of your ‘specific feedback’
Generic Title: Changes the title of ‘generic feedback’
Generic text: Changes the description of your ‘generic feedback’
Add custom option: This adds a third button to your intro screen which you can use to redirect visitors to a different part of you website (e.g. your contact page)
This makes your intro screen look like this:
If you’re only using specific feedback the default intro page will look like this, since it is aimed to explain to users on how to leave specific feedback:
The editing options allow you to change all the text on this page.
If the intro page is to your liking, click ‘next’ to go to the Exit Screen.
The Exit screen
Where you can use the edit button to edit the text you see in your exit screen.
After the exit screen you can click ‘save’ to save your form.
Previewing your form
Your form is now created! Use the button preview to see what it will look like on your site.
Now that you have a feedback button, and a feedback form, let’s put in on your website!