Note: While our most popular guides have been translated into Spanish, some guides are only available in English.

Site-wide animations

You can add animations that appear when visitors load a page or scroll through your site. Site-wide animations apply to: 

  • Image Blocks
  • Quote Blocks
  • Text Blocks
  • Video Blocks
  • Header and footer content

This guide reviews how to set different animation styles and speeds.

Site-wide animations are only available on version 7.1. If your site is on version 7.0, you can add animations to Image Blocks and Quote Blocks

Watch a video

Before you begin

  • Animations on Image Blocks, Quote Blocks, and other areas override site-wide animations.
  • When you turn off block and page animations, those areas follow site-wide styles. 

Enable or edit site-wide animations

To animate site content: 

  1. In the Home Menu, click Design, then click Animations.
  2. Select an animation style.
  3. Select an animation speed. The options are Slow, Medium, and Fast
  4. Click Save

Animation styles

Choose from these animation styles:

  • None - Disables site-wide animations.
  • Fade - Content fades in as it comes into view on the page.
  • Scale - Content animates from a smaller size to its final size, creating a zoom effect.
  • Slide - Content slides upward into place, accentuating the effect of scrolling down the page.
  • Clip - Content slides in line by line from the left. 

Here's an example of a site using the Scale animation:

scale_animation.gif

Remove site-wide animations

To disable site-wide animations:

  1. In the Home Menu, click Design, then click Animations.
  2. Select None.
  3. Click Save.

Content isn't animating correctly

Some content only supports the Fade animation style. If you select a different style, content that doesn't support it will fade instead.

If content isn't animating at all, ensure you're using a supported browser.

Was this article helpful?
20 out of 33 found this helpful