Reinitialize Webflow IX2

Hi @sebastianjung, thnx for your reply!

Still not triggering any new page interactions :frowning: A working example or if you could take a look would be great.

What i got so far: see my shared project - or the published page On the second page none of the webflow interactions are working.

  • in the Head Code inside the dashboard: i load the barba.js code which works.
  • in the Footer Code i first initiate the barba transition code
  • after that in the same Footer Code i try to run the reinitialize script with the data-wf-page id. But i’m unclear if this is the right order, or if this should be initiated inside the transition script or inside the barbara function.

@socraticus @Harry_B @mastermindesign any luck with this?

I’m sorry if i made false hopes but i am not using barba.js but nuxt.js instead :confused:

Looked at your example but don’t know enough about barba.js’ internals to be of any help i guess.

good luck though =/

Hey Guys,

Now I’m on this task too that most of you guys don’t seem to have solved yet. I’m using barbajs v2 and I’m trying to make normal interactions of webflow work again after the page transition is done.

barba.init({
  sync: true,
  
  transitions: [{
	
	async leave(data) {
      // ON LEAVE DESTROY WEBFLOW ???
	  Webflow.destroy();

      const done = this.async();

	  pageTransition();
      await delay(300);
      done();
	  console.log('leave');
    },
	
	async enter(data) {
        // ON ENTER INITIALIZE WEBFLOW ???
		var Webflow = Webflow || [];
        Webflow.push(function() {
            $('html').attr('data-wf-page', '5e8363a55808c6fd7f381e9b');
            window.Webflow && window.Webflow.destroy();
            window.Webflow && window.Webflow.ready();
            window.Webflow && window.Webflow.require('ix2').init();
            document.dispatchEvent(new Event('readystatechange'));
        });

        contentAnimation();
	  	console.log('enter');
    },

    async once(data) {
    	contentAnimation();
		console.log('once');
    }
	
  }]
});

However so far no luck. I don’t know how I could possibly make the normal interactions work with this. E.g. in my case I have a scroll animation on a page I’m navigating to. If I reload the page normally in the browser all interactions work, however if I navigate with a link click and barba events take over the interactions never re-initialize and fire.

I guess a lot of users would be really eager to find a working solution for this as this is not only important with barba but also other libraries.

Thanks, Matt

FYI, I moved over to a new thread with this as I’m simply not able to resolve this: Reinitialize Webflow with Custom Code

I realise I’m years late to the party here, but wanted to say thank you for your comment here. Hooking into the store and dispatching an action with a new state was the only way I have been able to properly reinitialise a Webflow animation. Thanks!

1 Like

@andy_burke Is there a way to dispatch an event to open the cart wrapper?

Any assistance would be greatly appreciated. Thanks!

Thank you sooooo much, you saved my day!

Hello friends, I see this still hasn’t been answered so here it is:

Webflow.require(‘commerce’) && Webflow.require(‘commerce’).init({siteId: “ENTER-THE-SITE-ID”, apiUrl: “https://render.webflow.com”});