How can I debug the issue of the Mux video player not loading on certain pages generated from a CMS collection in Webflow?

If a Mux video player is not loading on certain CMS-generated pages in Webflow, the problem is likely due to missing dynamic content, custom code issues, or external script loading errors.

1. Confirm CMS Field Data for Each Item

• Open the CMS Collection and verify that each item with a video includes a valid Mux playback ID or URL in its assigned field.
• If you're referencing Mux via an Embed block, make sure your dynamic field (e.g., "Playback ID") is populated in every affected CMS item.

2. Test Your Custom Embed Code

• In your CMS Template Page, locate your Mux embed implementation (usually inside an HTML Embed).

• Make sure your embed code is correctly referencing the dynamic binding. For example, if you're embedding a Mux player, check that the embed references the dynamic field like:

  "https://stream.mux.com/[Playback ID].m3u8" or JavaScript referencing {{wf {"path":"playback-id"}}} format.

• Try hardcoding a known working Mux Playback ID temporarily to see if player loads correctly.

3. Check Console for JavaScript Errors

• Publish the site and open an affected CMS page.
• Open Developer Tools (F12) and check the Console tab for errors related to:
• External Mux script failing to load
• Uncaught JavaScript errors
• Content Security Policy issues

4. Validate External Script Loading

• If you're using the Mux Player JavaScript, confirm that the script tag is included properly on each page where needed.
• Add the Mux Player script in the Before tag Site-wide (in Project Settings > Custom Code) or in Page Settings > Custom Code of the CMS template:
• https://cdn.jsdelivr.net/npm/@mux/mux-player (for the latest release)

5. Verify Placement of Embed Code

• If the Mux embed is inside a Collection List, confirm it is placed directly where the data binding can access the right collection scope.
• If using conditional visibility, ensure it doesn't hide the player unintentionally based on a missing or invalid condition.

6. Check for Webflow Rendering Issues

• If you're using lazy-loading or certain interactions, try disabling them temporarily to see if they interfere with the Mux embed.
• Use unpublished mode preview and published live URL to compare — Webflow Designer Preview sometimes behaves slightly differently.

Summary

To debug Mux videos not loading on CMS pages, verify that the Playback ID is present, the custom embed references are correct, and that the Mux Player script is loaded. Use browser dev tools to check for runtime errors. This systematic check will help you isolate whether the problem is in the CMS data, the embed code, or the script behavior.