Animated richtext

A modern way to highlight your brand message

The Animated richtext section is designed to help your brand message stand out. It blends text with small images in a visually engaging way, making it an excellent choice for communicating brand promises or other important statements.

You can style each word individually and insert images between words, allowing for creative and flexible layouts. Both words and images can be made clickable, for example, to link to specific collections or products.

To enhance the experience, the section features a smooth animation where each word fades in as the user scrolls, creating a dynamic and engaging interaction without overwhelming the content.

This section works especially well for:

  • Brand promises and value statements

  • Highlighting key messages

  • Drawing attention to featured collections or products

Animated richtext section settings

Configuration

In addition to the general section settings—such as color scheme and font size—there are two important options you should be aware of:

Image height Controls the height (in pixels) of all images displayed within the text.

Animate on scroll Enables or disables the fade-in animation for each word as the user scrolls. Disable this setting if you prefer a static display.

As mentioned above, each word follows its own logic. To build this section, you need to add each word (or group of 2–3 words) as a separate block, as shown in the screenshot above. Each image is also added as its own block.

This structure is required because:

  • The fade-in animation is applied per word

  • Images can be inserted seamlessly between words

  • Both text and images can be individually linked

When clicking the plus (+) icon to add a new block, you can choose between:

  • Text — to add a word or short phrase

  • Image — to insert an image within the text flow

Each block type (Text or Image) comes with its own settings, allowing you to fine-tune the appearance and behavior. For example, you can emphasize individual letters, add links, or adjust the image ratio, as shown in the screenshot above.

This flexible structure gives you full creative control while maintaining a smooth and engaging animation experience.

Last updated