Appearance
Animations
This guide describes the Theme settings > Animations menu options.
Apply animations to simulate movement on your store's pages for media items inside cascading content sections, like images.
The previous video shows a store's Collection page with a Cascading content section. Refer to Create layouts with cascading content. In the Theme settings > Animations menu, the checkbox option to Fade in items is set to on
. As the page scrolls down, a fade-in animation effect is applied to the media items that enter into view from the bottom of the page.
For general guidance with adjusting a theme setting, refer to Settings overview and Shopify help: Theme settings
Configure animations
To set how animations are displayed on your store's pages:
Go to Theme settings > Animations.
Select a setting described in the following table.
Setting name | Description |
---|---|
Cascading content > Fade in items | Select the checkbox Fade in items to turn on/ off fade-in animations for media items inside cascading sections. This setting is on (enabled) by default. With this setting on , a fade-in animation effect is applied to media items. When a store visitor scrolls down a store page, the animation is displayed as the media items enter into view from the bottom of the page. |
Cascading content > Enable parallax animations | Select the checkbox Enable parallax animations to turn on/ off parallax animations for media items inside cascading sections. This setting is on (enabled) by default. With this setting on , an animation effect scrolls smaller-sized media items at a faster speed than larger items, when a store visitor scrolls through a store page. |
Cascading content > Parallax intensity | Adjust the Parallax intensity slider to make the parallax animation effect more or less visible. The slider ranges from 0% to 100% (percent). |