Animated Page Transitions for Squarespace

Add animated page transitions to navigation between Squarespace pages. Adjustable speed and 50 different animations, including fade, zoom Make your website stand out, and be remembered.

What is it?

The best animated loading animations plugin for Squarespace. Faster than others, more reliable, easier to install. Super flexible. 58 animations and full control over the page transition speed and effect. Has a preloader option with a loading spinner. It’s the best Squarespace animation ever. Works for all Squarespace 7.1 and most 7.0 templates.

Why is this plugin better than others?

One reason. It’s faster. With other plugins, there is a delay after clicking. That completely destroys the experience. This plugin is instant, and the loading is done between the animations. Much smoother.

Animated Page Transitions for Squarespace

By default when clicking a link to go to a new page, the transition is not smooth. It’s kind of blunt and boring. Because we want to be classy, elegant, smooth and stand out from generic Squarespace websites, we want our page loading animations to be smooth as well.

Blog post about Squarespace loading animations & page transitions

I just wrote an in-depth blog post covering Squarespace Page Transitions and loading animations in my blog.

Ad

Updates 14. Jun 2023

• Fixed a bug with gallery block lightboxes. They look like links and would trigger the animation. But as they’re a lightbox, not a link, I excluded the animation from firing with them. Now working perfectly.

Updates 5. Jan 2022

• Firefox has a bug causing blank pages. Fixed by adding a solution which makes it work, but the animation isn’t as fast as with other browsers. Still quite smooth. Firefox It’s only used by 3.26% of users, so 96,74% of users will still get the perfect, quick animations.

Updates 2. Jan 2022

• Overlay option unsupported. Safari on iOS has a bug, causing back button to not load with animation. Fixing it would take too much time right now. So using overlay is no longer recommended.

Updates 13. Dec 2022

• fixed a bug where folders on mobile triggered the animation before clicking the real link inside the folder

Updates 30. Oct 2022

• Fixed a bug where a gallery block lightbox didin’t open with animations enabled

• Massive improvement to the plugin code. It’s now targeting animation element more specifically to make sure that bugs (like gallery lightbox) won’t happen.

• Improved the support in older Squarespace 7.0 themes: Mojave, Wells & Wexley

Updates 28. Oct 2022

• Fixed a bug where the loading screen overlay sometimes had a 0.05 second flash of white when using different color for the loading screen than the Squarespace background-color.

Updates 21. Oct

• Fixed “mailto” links that are used for email sending. Those no longer launch the animation and hide the page

• Fixed some common download links like pdf’s. They no longer animate or hide the page.

Updates 20. Oct

• Made the installation easier. Now just 1 copy-paste.

• Added 57 new animations

Updates 14. Oct

• Added the color change to the overlay

• Added automatic detection for overlay. Now it’s easier to use

Updates 9. Oct

• Added the live demo

• Minified the code for faster loading

• Fixed a bug where overlay z-index left it behind the website

Squarespace Page Transitions & Loading Animation list

FADE IN Animation

• Fade in

FADE OUT Animation

• Fade out

FADE UP IN Animation

• Fade in up small

• Fade in up

• Fade in up large

FADE UP OUT Animation

• Fade out up small

• Fade out up

• Fade out up large

FADE DOWN IN Animation

• Fade in down small

• Fade in down

• Fade in down large

FADE DOWN OUT Animation

• Fade out down small

• Fade out down

• Fade out down large

FADE LEFT IN Animation

• Fade in left small

• Fade in left

• Fade in left large

FADE LEFT OUT Animation

• Fade out left small

• Fade out left

• Fade out left large

FADE RIGHT IN Animation

• Fade in right small

• Fade in right

• Fade in right large

FADE RIGHT OUT Animation

• Fade out right small

• Fade out right

• Fade out right large

ROTATE IN Animation

• Rotate in small

• Rotate in

• Rotate in large

ROTATE OUT Animation

• Rotate out small

• Rotate out

• Rotate out large

FLIP vertical IN Animation

• Flip in vertical far

• Flip in vertical

• Flip in vertical near

FLIP vertical OUT Animation

• Flip out vertical far

• Flip out vertical

• Flip out vertical near

FLIP HORIZONTAL IN Animation

• Flip in Horizontal far

• Flip in Horizontal

• Flip in Horizontal near

FLIP Horizontal OUT Animation

• Flip out Horizontal far

• Flip out Horizontal

• Flip out Horizontal near

ZOOM IN Animation

• Zoom in small

• Zoom in

• Zoom in large

ZOOM OUT Animation

• Zoom out small

• Zoom out

• Zoom out large

Loading Screen option Animation

• Loading Screen animation - slide in top

• Loading Screen animation - slide out top

• Loading Screen animation - slide in bottom

• Loading Screen animation - slide out bottom

• Loading Screen animation - slide in left

• Loading Screen animation - slide out left

• Loading Screen animation - slide in right

• Loading Screen animation - slide out right