How to filter CMS data for the current member using Finsweet Filter and FS Load with over 100 items? Answered

• 

  A J

  • June 09, 2025 15:09

  Patrick , you can take the above approach of filter + load, but another way to go about it could be to modify #44 memberscipt to work for the items enabled with Finsweet CMS Load.Clone the page you want to set this up in and try the following so that you have a back-up page saved.You can follow the tutorial shown in the #44 memberscript to setup the collection list, the relevant attribute etc.Paste this code in the

  section of the custom code in the page you are setting the memberscript:

  <!-- [Attributes by Finsweet] CMS Load -->
  <script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsload@1/cmsload.js"></script>
  

  Paste this modified code in the Before tag section of the custom code instead of the #44 memberscript:

  <script>
  document.addEventListener("DOMContentLoaded", function() {
    let memberId = null;
  
    function updateMemberIdVisibility() {
      if (localStorage.getItem("_ms-mem")) {
        const memberData = JSON.parse(localStorage.getItem("_ms-mem"));
        memberId = memberData.id;
  
        if (memberId) {
          const elements = document.querySelectorAll("[ms-code-member-id='" + memberId + "']");
          elements.forEach(element => {
            element.style.display = "block";
          });
        }
      }
    }
  
    // Initial call to set visibility on page load
    updateMemberIdVisibility();
  
    // Set up a MutationObserver to watch for changes in the DOM
    const observer = new MutationObserver((mutations) => {
      let shouldUpdate = false;
      mutations.forEach((mutation) => {
        if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
          shouldUpdate = true;
        }
      });
      if (shouldUpdate) {
        updateMemberIdVisibility();
      }
    });
  
    // Start observing the document with the configured parameters
    observer.observe(document.body, { childList: true, subtree: true });
  });
  </script>
  

  Save and publish the site and test it out. Hope this helps.Let me know if you face any error / issues.

  The approach shared has worked for 8000+ cms items in the past in other use-cases.But since I don't have more CMS items in my personal dummy site, to test it out for you, it would be better for you to test it in a cloned page, since you have more CMS items. I just want to know if there are any improvements that you might need in terms of speed of loading etc. But the approach combined with CMS Load, should work for your use-case as well.
  0
• 

  Patrick

  • June 09, 2025 15:12

  A J It worked! Thanks 😄

  I don't have that many bookings yet, so I'll check how it goes

  0
• 

  Huy Khiếu

  • June 09, 2025 15:12

  Hey there I'm using #44 approach to limit the item based on member-id, but anyone know how can we display the empty state if every items've already set display = 'none'?

  0
• 

  A J

  • June 09, 2025 15:13

  Hey Huy Khiếu, you could take inspiration from this memberscript to hide the section if there is no collection item to be displayed and you could also customize this further for your use-case, where you show a certain section if every item is hidden.

  0

Please sign in to leave a comment.