Effects, transitions and pointers

Effects, page transitions, pointers and the loading screen add motion to your site. Each one is set site-wide from the left rail. The Effects, Page transitions and Loading screen windows include a live preview.

Effects#

Click Effects in the left rail. The window has three tabs, one per effect slot. You can use one effect in each slot and combine all three.

1. Pick a tab, then click an effect.
2. Adjust its settings, such as intensity or smoothing. Settings differ by effect.
3. To go back to an effect's starting values, click Reset to defaults.

Overlay effects sit over the whole page. Scroll effects react as visitors scroll. Pointer effects follow the visitor's pointer. Some pointer effects have a Layer style section, and some can be set to Draw behind content.

Keep pointer effects off a section#

1. Hover the section and click Section settings.
2. Under Site effects, turn off Include this section.

Pointer effects then won't react over that section.

Page transitions#

Click Page transitions in the left rail to set how your site animates when a visitor goes from one page to another. A transition has two parts, and you can combine any of them:

• Wipe: how the old page gives way to the new one. Choose Dissolve, Cube Flip, Horizontal Bars, Random Squares, Stair Wave, Radiating Noise, Triangles, Corner Wipe, Corner Columns or Curtain.
• Camera: how the view moves while the wipe plays. Choose None to keep it still, or a move: Settle (a gentle zoom that eases in and out), Tilt and Roll, Push In, Pull Back, Pan Left, Pan Right, Crane Up, Crane Down, Orbit, Barrel Roll or Whip Pan. The camera leaves the old page and arrives on the new one in a single motion.

Each option shows a short description when selected. New sites use Dissolve with no camera movement.

Pointers#

Click Pointers in the left rail to choose the cursor visitors see:

• Default keeps the visitor's normal cursor.
• Ring shows a circle that follows the pointer. Set its Color, Size and Border. Switch between Regular and Hover to style how it looks normally and when it's over something clickable.

Loading screen#

Click Loading screen in the left rail to style what visitors see while your site loads.

• Loader: choose Shapes (Spinner, Dots or Orbit), Counter or Bar, then set its colors and Background.
• Reveal: choose how the loading screen clears to show your site. Pick a Wipe and a Camera, the same choices as page transitions. The camera only moves onto your site, since there's no page before it.