Get your typeform off to a great start with a Welcome Screen. Like the cover of a book, you can use it to entice your audience with a nice image, explain the purpose of your typeform, who you are, and more.
1. To add a Welcome Screen, open the typeform from your Workspace, click the + button to open the question menu, and select Welcome Screen.
2. It'll look like this. You can add one Welcome Screen per typeform.
3. You can now add text to your Welcome Screen, by writing into the Editor panel (where it says Say hi!). You can also write a description (it will appear blank if you write nothing).
You can edit the Start button in the Question settings on the right.
You can change the button text, up to 24 characters long:
You can adjust the following features from Question settings:
If your typeform has Hidden Fields enabled, you can use Recall Information in your text to include information from them. So if you already know a respondent’s name, you can add it here. Type "@" to bring up a list of your Hidden Fields to choose from, and include in your text.
1. Click Add next to Image or video in Question settings:
2. This will open a new menu with our image/video tool:
Here you can search the Unsplash for free images you can use, browse our Icon library, or click Upload to add your own image.
You can upload JPEG, PNG, static and animated GIFs. The maximum size is 4MB. The maximum width is 800 pixels – if your image is wider, it will be automatically resized to this.
3. Select an image or video that you like, or upload your own:
4. Now you can customize the way your image appears in the Layout section of your Question settings:
Add a Background image
1. Click Design in the side panel on the right-hand side to open the design tool:
2. Now click Add next to Background image:
4. Now you'll see our image tool, where you can browse our libraries, or upload your own image:
This article explains everything you need to know about adding a Background image.
How to skip the Welcome Screen on mobile
We display embedded typeforms as full-screen pop-ups on mobile by default to improve user experience. These pop-ups contain a placeholder start screen with the name of the typeform and a launch button.
You can override the pop-up with a small edit to your site code. Find where your embed is located in the code. After the "data-tf-widget" attribute, add the snippet "data-tf-inline-on-mobile". Your code should look something like this:
<div data-tf-widget="ABCDEF" data-tf-inline-on-mobile></div>
This will show your typeform as an inline embed on mobile. The placeholder start screen will no longer appear - instead, respondents will see your typeform's Welcome Screen, if it has one.