Learn how to redirect visitors to a cool Thank You Page after submitting a Multi-Step Form. In our example, visitors can sign-up for a gym membership, and after doing so.. are redirected to a cool Lottie Animation Thank You Page. Turning it into a one-of-a-kind experience.
In this tutorial you’ll learn how to:
✔︎ Use redirect after submit in Elementor’s Form Builder
✔︎ Add Lottie Animations to your designs
✔︎ Use Lottie’s Online Editor to tweak animations to your liking
✔︎ Set Animations to play according to your preference
✔︎ And much more!
Hi All, It’s Ziv from elementor.
Today I’ll show you how to redirect visitors to a Cool Thank you Page after submitting a Multi-Step Form. In our example.. visitors can sign-up for a gym membership.. and after doing so.. are redirected to this thank you page which includes a custom lottie animation set to play automatically. Turning it into a one-of-a-kind experience.
So Let’s see how it’s done.
First of all.. on the sign-up page.. Go to your multi-step form and ..in Actions After Submit.. Choose redirect. You’ll see the redirect dropdown appear below.. Click on it.. Here is where you add the link to your Thank You Page.
You can either paste it in, or click on dynamic tags and under site.. Choose “internal URL” then click on it to open it’s settings and set the type to content. Then search for your thank you page and select it, that’s all.
For this tutorial I’ve gone ahead and pre-built the thank you page, so we can focus on the lottie animation that makes it stand out. Let’s open it so you can see. To save some time.. I’ll go ahead and click cmd or control plus E to open the finder.. Then search for the page,… here it is…I’ll hold down cmd or control so it opens in a new tab when I click it.
Okay let’s liven this page up a bit by adding a cool lottie animation.
Simply search for and drag in the lottie widget.
Here you can choose the source. You can either use an external URL by simply copying the online Lottie Animation link, and pasting..like so… OR set the source to Media File, and upload your own Lottie Animations.. which is what I’ll do for this tutorial.
I’ve gone ahead and used the online Lottie Editor to make sure the animation suits my site’s colour palette. I changed the t-shirt colour and hid the background layer so it’s transparent.
Then download it ….. Aand back in the Lottie Widget,..choose “upload JSON file”.
Next, Drag in the file to upload… and insert it.
Let’s first go to style and make sure it fits in nicely with my design. I’ll increase the size by using the width slider and change the unit to px. I’ll set it to 750
Back in content, let’s go to settings.. and make sure the animation plays according to our preference.
I’ll set the trigger to “none” so the animation Plays automatically..I’ll also set it to loop, so it continues playing..
Lastly I’ll slow down the speed a bit like so, great!
Let’s update, go back to the form and check it all out!
Cool!
Well that’s it!
Now you know how to redirect visitors to a Cool Thank you Page after submitting a Multi-Step Form.. and use the lottie widget to add custom animations to your site, Turning it into a one-of-a-kind experience.
So go ahead… add your own lottie animations to your designs.. your sites will stand out and experience increased engagement.. without touching any code.
Have fun playing around and don’t forget to subscribe to our YouTube channel for more tips and tutorials.
Ciao for now!
