AJAX transitions across whole site

3 0 0


What's the best/easiest approach to implement AJAX transitions with animations between shopify templates - pages/colections/products without reloading the site? 

I aim to achieve this level of front end interactions: https://www.jacquemus.com/ 

Basically I would love to call some JS to fetch the content and have before/after function to implement simple animations using js/css.

For example at Wordpress it is as easy as calling a smoothstate plugin function on a container and utilize callback functions:

var settings = { 
            onStart: {
                duration: 280, // ms
                render: function ( $container ) {
                    $container.addClass( 'slide-out' );
            onAfter: function( $container ) {
                $container.removeClass( 'slide-out' );
        $( '#page' ).smoothState( settings );


Is there anything like this for Shopify?

Thanks, I will appreciate any advice on how to tackle this.

Reply 1 (1)

Shopify Partner
20 0 10

Shopify itself does not provide the functionality. So you'd need to implement a solution with pure JavaScript or via a library (smoothstate, barbajs, etc.).