Animations
Animate blocks to enhance the user experience.
Last updated
Animate blocks to enhance the user experience.
Last updated
Animations are an effective way to increase user engagement and enhance the visual appeal of your website. By using animated blocks, you can highlight content, improve the flow of reading, and create a dynamic user experience. Here, you'll learn how to animate blocks in the Shopping Experiences using the CMS Bundle.
What are animated blocks?
Animated blocks are content that are activated by various motion effects during page load or scrolling. They not only give the website a modern aesthetic but also help to highlight important information and actions.
Select Block: Choose the block you want to animate and open the advanced block settings of the CMS Bundle.
Configure Animations: Under Animations, you will find the settings that you can apply to the block.
| Setting | Description |
|---|---|
Animation Type | The different types of animation (zoom, flip, fade, ...) |
Behavior | The behavior determines the dynamics of the animation. For example, you can choose a fast start but a slower end for the animation. |
When clicking on the button for advanced animation settings, a popup appears with additional configuration options.
| Setting | Description |
|---|---|
Animation Display | The general behavior of the animation |
Animation Duration | How long it takes for the animation to fully complete (in milliseconds). |
Animation Delay | Set the delay for the start of the animation in milliseconds. |
Anchor Point (Advanced) | When the specified selector becomes visible, the block's animation will be triggered. This allows you to create interdependent content. |
