Using WF Ecommerce with AJAX, PJAX, BARBA & friends

Hi there,

I’m working on a project where I need to use ajax or ajax based scripts in order to supercharge a webflow ecommerce store. But I’m struggling to understand how to properly re-initialize wf ecommerce for add to cart buttons & friends to work correctly.

The basic use case :
You have 500 products you need to display in a page in order to filter, search and what not in your whole product collection. For it to not have too long page load times you load first 50 and then next 50 etc 10 times with AJAX. But now your 50 first products work fine with interactions and ecommerce but the 450 next are broken > no add to cart and no interactions on those.

I know you can re-initialize ix-2 (many posts on that when using Barba.js or pjax) but how do your re-initialize ecommerce ?

The command is most likely looking like this :
Webflow.require('commerce') && Webflow.require('commerce').init({siteId: "YOUR-SITE-ID", apiUrl: "https://render.webflow.com"});

But when is it best to call it ?
Before calling ix-2 ? After ? Does the page id have some importance ?

Would be awesome to know what’s the best way of doing this (and still respecting the way webflow is supposed to execute)

@danro ? Would you accept to give a hint on how to solve this ?