Animated cart for Shopify.com templates. This plugin is made for Shopify.com but It should not be problem convert it to other e-commerce, if you want fork this repo. :)


Sooo animated

Installation on Shopify.com

Download [this repo](dist/ https://github.com/greenwoodents/quickbeam.js/archive/master.zip). Import dist/quickbeam.min.js and dist/quickbeam.scss files to your Shopify assets/ folder. File dist/quickbeam.liquid import in to templates/ folder.

Add this <script> tag before closing </body> tag in your layout/template.liquid file.

<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.18.0/TweenMax.min.js"></script>
{{ 'quickbeam.min.js' | asset_url | script_tag }}
  var cart = Quickbeam.init({
    'animationLib': 'gsap',
    'variantSelector': function () {
      // Return selected variant


All of available options.

  'animationLib': 'gsap',
  'variantSelector': function () {
    // Return selected variant


If you are using GSAP, you can use this animation library with Quickbeam. Pass this parameter to init function. If not vanilla javascript animation is used.

  'animationLib': 'gsap' //Or falling to vanilla js animation.


If you have special selector of variant type in your e-commerce and default function is not able to select variant for you. You can make your own selector and return variant.

Expecting string in return;

  'variantSelector': function () {
    // Return selected variant in string.

Browser Support

Quickbeam depends on the following browser APIs:

It supports the following natively:

  • Chrome 24+
  • Firefox 23+
  • Safari 6.1+
  • Opera 15+
  • Edge 12+
  • IE 10+
  • iOS Safari 7.1+
  • Android Browser 4.4+

To support older browsers, consider including polyfills/shims for the APIs listed above. There are no plans to include any in the library, in the interest of file size.


Install development dependencies

npm install

Run gulp.js



Feel free to open pull request.


See also the list of contributors who participated in this project.


This project is licensed under the MIT License - see the LICENSE.md file for details


• Released: May 21, 2020, 05:04 AM


Author: greenwoodents
Item was Featured Author was Featured
Animated cart for Shopify.com templates. size
git clone https://github.com/greenwoodents/quickbeam.js.git