CMS Load More breaks scripts for loaded items

Attributes
1

Hey everyone. I have a collection that has more than 250 items. We want to show it on one page without pagination or load under CTAs.To do so… I’ve used finsweet CMS Load More Render-All (and tried with infinite-scroll too). It works great but…

On all rendered items (initial pagination was set to 50 so 51+) don’t have working scripts

It must work as the main feature of each item is to enable custom-video-player.

I’ve tried to look for a solution via GPT and it showed me this code. Would that work? Are there any confirmed fixes?

<script>
  window.fsAttributes = window.fsAttributes || [];
  window.fsAttributes.push([
    'cmsload',
    (listInstances) => {
      console.log('CMS Load Successfully triggered!');

      // Get the first CMS List instance on the page
      const [listInstance] = listInstances;

      function yourCustomFunction() {
        // Your custom script logic here
      }

      // Execute your custom function immediately
      yourCustomFunction();

      // Set up an event listener for when new items are rendered
      listInstance.on('renderitems', (renderedItems) => {
        yourCustomFunction();
      });
    },
  ]);
</script>
2

Hey @dawid! Yes, this is the CMS Load callback function and it is setup to listen the render of new items.

With this setup, I would recommend the infinite scroll option as to not impact page load times. yourCustomFunction() will run every time items are rendered. You can DM me the site if you need help setting this up :muscle: