In the Create tab, you can prepare the layout for your survey by adding your questions, changing its theme, and setting up survey settings. In this article, we will walk you through altering your survey look by:
changing the theme colors to ensure it's completely in line with your company's branding;
adjusting your survey settings, such as positioning your survey on different parts of the page, setting up overlay options, or customizing survey message copy.
This article shows how to customize the widget survey design. If you want to learn first how to create the survey or install the Survicate tracking code on your website, please navigate to one of the below sections.
Create your survey theme
It's very easy to adjust your survey's look to your website just by playing with the selector tools in the Design tab. There, you'll find our standard themes for your survey.
If you see a dark and light branded theme in your Website survey, these are created especially for you based on your website's colors.
1. To create your own theme, click on the New theme button.
2. On the left side, you will be able to give your theme a name and see the color selectors for your theme. Here, you can adjust the colors to your brand and enable Customization to let your respondents know that you're the one conducting the survey.
💡 You can also upload your logo in the Survey settings > General tab, to easily add it to any of your Email, Website, or Mobile surveys.
3. Once you are ready with your template, click Update Theme to save your settings.
💡 If the theme you are using is currently used in any other surveys, you will see a notification. In this case, please remember that any changes you make to this template will apply to all surveys running on that particular template.
If you don't wish to update all the surveys but only your particular survey, then you can easily duplicate your theme and make changes to this theme instead.
4. Edit your custom CSS from the Theme Settings.
Enable the Custom CSS toggle in the theme settings, and paste in your CSS code after clicking on the Add button. Then update your theme. Your changes should be visible on the right side of the Create tab when you update your theme.
Adjust your survey settings
Once you have finished with the theme setup, click on Settings in the left sidebar for further installation. There, you'll see the Survey experience and Messages tabs.
The survey experience section allows you to decide on your survey's look and behaviour. Here you can adjust how you would like the survey to appear on the screen, its details, and its position. You can also disable and enable the Close and Minimize buttons by checking their toggles.
Progress bar: The progress bar lets your respondent see at which point of the survey they are and informs them about the length of your survey. It's located at the very top of your survey.
Remove branding: In some of the paid plans, you have the option to remove the Powered by Survicate footer from your survey. You can see a list of our pricing and features here.
Start minimized on desktop: It's possible to define how your survey will start on the desktop. You can decide to start your survey minimized and extend it only when a visitor clicks on the widget.
Start minimized on mobile: Define how your survey will start on mobile devices; by enabling this toggle, you can start your survey on the minimized setting and extend it only when a visitor clicks on the widget.
Close button: You can enable or disable the close button, to prevent the survey from being closed.
Minimize button: Let your visitors minimize the survey instead of closing it.
Layout: You can position your survey in different locations on the page, upper left or right, center, or lower left or right.
Background overlay: If you would like to add a website fade out, you can set this in the drop-down menu to dark overlay or light overlay.
Default language: analytical function created to examine what default language is desired by our users.
The Messages tab allows you to change the text of your survey buttons or customize the text on a minimized survey invitation to add a catchy message. This is especially useful if you are running a survey in a different language.
Preview your survey
On the right side of the page, you can preview your survey as if you were a respondent before launching it on your website. Every change to your survey appears here in real time, and you will be able to test the look and feel of your survey as you go on creating it.
💡Click the icons in the top right corner to see how your survey looks on desktop or mobile devices:
Next steps:
📞 If you have any questions or need assistance - feel free to reach out to our team via chat or email: support@survicate.com.