How can I run code after the items have loaded on my page? Is there a callback I can use?

You can use the Attributes API to:

  • Add JavaScript to Attributes solutions.
  • Add custom functionality to Attributes when the default no-code functionality does not satisfy the use case.
  • Integrate third-party JavaScript libraries with Attributes solutions.
  • Integrate third-party data (data outside of Webflow CMS) with Attributes solutions.
  • Programmatically set custom values to filters, search, range sliders, etc.
  • Listen for events such as “renderitems”, “switchpage”, etc, to trigger custom actions when desired.

Here is the callback to CMS Load, read the docs here: Attributes API Documentation

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

    // The callback passes a `listInstances` array with all the `CMSList` instances on the page.
    const [listInstance] = listInstances;

    // The `renderitems` event runs whenever the list renders items after switching pages.
    listInstance.on('renderitems', (renderedItems) => {
      console.log(renderedItems);

    });
  },
]);
2 Likes

I understand this to mean that we can use this code snippet in the same way we would use a Webflow.push function or a DOMContentLoaded event listener, but this is solely for attributes scripts loading as they are async? Is this correct?

Thanks