2.0 Beta

Smootify 2.0 is in public beta. Your 1.x store keeps working. Move when you want.

What changed

Developers

The JavaScript API, events and filters, the Shopify AJAX API, options and CSS.

On this page
  1. JavaScript API
  2. AJAX API
  3. Options
  4. CSS

JavaScript API

  • Run your scripts with Smootify: How your own code waits for Smootify, with window.Smootify.push, script type smootify-load or the smootify:loaded event, and the order in which they run at load.
  • JavaScript API: The methods of window.Smootify by task, for the cart, products, the customer, the market and consent, with short examples and how each kind of method answers.
  • Events: The events Smootify sends when something happens on the page, how to listen with Smootify.on and once, which event to use for which task, and the ones sent on an element instead of the document.
  • Filters: Change what Smootify does before it does it, with Smootify.addFilter and its four filters for the lines added to the cart, the checkout address, draft orders and the metafields a page asks for.
  • Render a metafield yourself: Write a metafield value with your own code, with the smootify.devMetafield event that fires after Smootify's render, and render a list metafield from smootify.renderedMetafields.

AJAX API

  • Shopify AJAX API: The Shopify theme endpoints Smootify answers on a Webflow site (/cart.js, /cart/add.js, /products/{handle}.js and more), what each one supports, how to start app code after Smootify, and how to turn the emulation off.

Options

  • Options: Configure Smootify with window.SmootifyUserOptions, grouped by task, plus the label globals, the page overrides, the cart animations and the attributes Smootify reads on the html element.

CSS

  • "CSS: states, skeletons and variables": What Smootify's stylesheet does, the state classes and page flags you can style, the skeleton placeholders and their variables, popover backdrops, upload classes and the CSS variables Smootify writes.

    ↑ ↓ to moveEnter to openEsc to close