Inject Elements - Working but lose functionality

Attributes
1

Hello - to put it simply - I’ve created a swiperJS slider component in webflow (swiper code inside the component) and I’m attempting to inject the component into blog articles by manually placing the component within a given article.

The component gets injected without issue, but the slider functionality is lost. Any ideas on if this can be fixed or is inject meant for static components?

2

Hey @tanner!

When you inject a component using Attributes Inject, there’s a timing issue - the JavaScript runs before your slider component exists in the DOM.

You can solve this with the Inject API callback, which waits for the injection to complete before initializing your slider:

<script>
  window.FinsweetAttributes ||= [];
  window.FinsweetAttributes.push([
    'inject',
    (componentsData) => {
      // Your Swiper init code goes here
    },
  ]);
</script>

Could you give this a test and let me know how it goes?

3

Thanks Luis,

Unfortunately this isn’t doing the trick. Here’s the full code in case it’s helpful

4

Hey @tanner! Could you share a read-only link? I’ll adjust the code to your setup!