Ready to build a website that does it all? 🏆 Get the free Webflow x Typeform ebook

here
Signup
 

End Screens and redirects

Typeforms finish with an End Screen, which appears after respondents click submit. If you're using a Score quiz, Outcome quiz, or Branching and calculations, you can show your respondents different End Screens based on their answers. If you're on a Plus plan or above, you can redirect your respondents to different webpages based on their answers, instead of displaying an End Screen. 

You can use multiple End Screens and redirects in the same form, but respondents will only see one End Screen or redirect, based on the Logic you have set up. If you're on a Plus plan or above, you can use both End Screens and redirects in the same form.

Click a section header to learn about End Screens or redirects:

Add End Screens to your form

Follow these steps to add End Screens to your form:

1. Open your form from your Workspace.

2. You can find the list of End Screens you've created for this form under Endings in the left-hand Content panel. Click an End Screen to edit it.

2024-04-04_10-34-59.png

To add a new End Screen, click and choose End Screen.

2024-04-04_10-40-13.png

3. Click on the End Screen text to change it. You can use Recall information in your End Screen: type @ to include information (answers, scores, price, or Hidden Fields) from your form. This is useful for reminding respondents of information that they entered while filling out the form, or addressing them by name.

2024-04-04_10-44-35.png

HC_BobRoss_ilu_cropped.png
Tip! Remember, you can put URLs in your text, and they'll be automatically clickable. However, we don’t support HTML tags for hyperlinking.

End Screen settings

Use the right-hand Question panel to change the End Screen settings. 

2024-04-04_10-47-11.png

Button

By default, your End Screen has a button that says "Create a typeform". When a respondent clicks the button, they'll be taken to this page, where they can learn more about Typeform.

You can toggle this on and off, and also change the text of the button here. Changing the button text won't change the link–read on to the next section to learn how to do that.

2024-04-04_10-50-50.png

Redirect to URL

By default, the End Screen button redirects your form to a new page, as explained above. Depending on your Typeform plan, you can change this to link to any URL you like. So if you want respondents to visit your site after completing the form, just add the link here.

You can even use Recall information to reference Hidden Fields or Text variables in the URL—just make sure that the values of the Hidden Field or variable match the page names in the URL you plan to use.

2024-04-04_10-55-45.png

 

HC_Note_new.png
Note! Your URL must be a secure HTTPS address—make sure this is included in your URL or the redirect won't function.

Share icons

Turn on the Social share icons toggle so people can see social share icons. These let your respondents share your form quickly on Facebook, Twitter, and LinkedIn.

2024-04-04_10-59-20.png

 

HC_Note_new.png
Note! In most cases, these buttons will share the form. If the form uses Logic to create an Outcome quiz or Score quiz, however, these buttons will share the respondent's quiz results.

Note that when you're recalling information from Hidden Fields, responses, or variables to show the results of a quiz, your respondents will currently see a random string instead of the recalled information when the form is shared on social media.

Share_recall.png

Image or video

To add an image or video to your End Screen, click + next to Image or video in the Question panel.

 

2024-04-04_11-02-35.png

To add an image, upload or drop your own image file or choose an image from the Unsplash library.

Screen_Shot_2021-08-27_at_12.07.58_PM.png

You can upload JPEG, PNG, static, or animated GIFs. The maximum width for an End Screen image is 800px–larger images will be automatically resized down to this width.

After you've chosen your image, change its position in the End Screen by choosing one of the Layout options in the Question panel, and add alt text to improve accessibility. To edit the image, click Change next to Image or video.

2024-04-04_11-06-12.png

You can crop and adjust your image, add filters to it, and change its colors.

2024-04-04_11-10-02.png

Once uploaded, you’ll see what your End Screen will look like directly in the editor.

2024-04-04_11-11-04.png

To remove your image, click the trash can icon in the Question panel or in the top-right corner of the image.

2024-04-04_11-12-02.png

Video

You can include a video from YouTube or Vimeo or search the Pexels library. Simply click the Add button next to Image or video, switch to the Video tab in the media editor, and paste in the URL of your video or search for one you like. 

Screen_Shot_2021-08-27_at_12.52.24_PM.png

HC_BobRoss_ilu_cropped.png
Tip! You can use a video or an image, but not both. If you’ve added an image, you must remove it before trying to add a video!

Delete End Screens

To delete an End Screen, click the three dots next to it in the left-hand Content panel, and select Delete.

2024-04-04_11-13-01.png

Adding End Screens is optional. If you delete all of your End Screens, your responders will see a default End Screen like the one below (with colors depending on your theme).

defaultending.png

Add redirects to your form

Instead of showing respondents an End Screen when they finish your form, you can automatically redirect them to a URL of your choice after submission. This is available on Plus plans and above. 

To add a redirect to your form, follow these steps:

1. Open the form from your Workspace.

2. Click the sign next to Endings in the Create panel. Choose Redirect to URL.

2024-04-04_11-33-54.png

3. Your redirect will appear in the list of Endings.

2024-04-04_11-35-10.png

In the center of the screen or in the right-hand Question settings dialog, add the URL you want to redirect respondents to after submission. Respondents won't see the screen with the URL when they submit the form. Instead, they'll be redirected to the URL you add.

Under URL Label, you can add a label to your redirect as a note or summary of the URL you've added. The label will appear in the list of Endings for easy visibility, but it won't be visible to form respondents, who will instead be redirected to the URL you add.

2024-04-04_11-35-10.png

Your URL must be a secure HTTPS address. Make sure this is included in your URL or the redirect won't work. You can add multiple redirects to the same typeform. 

You can use Recall information as part of your redirect URL to send respondents to different pages based on their question answers or variable or Hidden Field values.

2024-04-04_11-42-26.png

Click here for a guide to referencing Hidden Fields in redirect URLs, and here for a guide to referencing variables.

When you reference a Hidden Field or variable in your URL, the value of the Hidden Field or variable becomes part of the URL, not the name of the Hidden Field or variable. For example, you might reference the variable city in your redirect, like so:

2024-04-04_11-44-59.png

Respondents who are redirected after submission will be directed to URLs like www.mycompany.com/london, or www.mycompany.com/cairo, depending on what their value for that variable is. They will not be redirected to www.mycompany.com/services/city. 

For this reason, it's important to make sure that any items you recall in a redirect URL will lead to an existing page, no matter what their values are. 

If you've embedded a form on your website that redirects respondents to another form, you can redirect respondents within the same frame on your website. You'll just need to add the following attribute to the form embed code:

data-tf-redirect-target="_self"

It should be added after the data-tf-live attribute with a space in between, as shown in the image below:

2024-12-05_14-13-29.png

Tap into our community knowledge