CMS load solution interfering with my script to use the CMS title field as a caption for multi images

Attributes
1

Hi there, i’m using the CMS load with my collection list, where I have images with captions, and I’m using a script to fetch the title of the cms item as the caption of that image in a lightbox element on the page

The problem is that when I load more items, the newly loaded items dont get the caption displayed like the ones that are already there when the page loads

So basically the script is not working for newly loaded items

I already have the attribute fs-cmsload-resetix=“true”

Here’s my read-only link: Webflow - Alalong

Here’s the published page: Projects | Rendering & Visualization

I’d be very grateful to receive some help on this!

2

Hey @gabriel.babus! You will need to use the CMS Load callback function to rerun the snippet each time new items are rendered. The basic structure is this

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

      const [listInstance] = listInstances;

      // Code here will run for the first page of the collection list

      listInstance.on('renderitems', (renderedItems) => {
        console.log(renderedItems);
        // Code here will run each time we render more 
        // items by pagination, infinite scroll or load more

      });
    },
  ]);
</script>

Let me know if you face any issues and I’ll be happy to help!

3

Thanks so much for the reply, Luis. Would you be kind and help me tailor this CMS load callback function to my use case, including the script I need to fire for the caption text to appear?

I’d be extremely grateful!

4

Hey @Support-Luis any chance I could get your help on this? Let me know! Thanks a ton

5

Hey @gabriel.babus! Sure!

Can you please help me find the code you already have running? I can’t seem to find it on this page → Projects | Rendering & Visualization