Do you want to add a click delay on a Lottie animation in WordPress? Adding a delay before a click action allows the animation to fully play before redirecting or performing another action, enhancing the overall user experience and making interactions more fluid and engaging.
With the LottieFiles Animation block from Nexter Blocks, you can easily add a delay on click so it redirects after the Lottie animation plays.
To check the complete feature overview documentation of the Nexter Blocks LottieFiles Animation block, click here.
Requirement – This block is a part of the Nexter Blocks, make sure it’s installed & activated to enjoy all its powers.
To do this, add the LottieFiles Animation block to the page and follow the steps –
1. In the Lottie Content tab, select the appropriate JSON input type and add the Lottie animation.
2. Then select On Click from the Play On dropdown under the Main Settings tab.
Note: You can select any option, but for the best effect, you should select On Click. Also, make sure to disable the Loop Animation toggle, so the animation doesn’t play in a loop.
3. Then enable the URL toggle.
From the Type section, you can select a link type.
Note: Both Normal and Dynamic work the same way.
4. Based on your selected Type, you have to add your link in the given field.
5. Then in the Click Delay (ms) section, you have to add the delay. You can set the delay as per your animation duration, so it redirects after the animation ends.
In the Aria Label field, you can add an Aria label to improve the accessibility.
Now based on your settings when you click on the Lottie animation the animation will play then it will redirect to your specified link.
