mixpanel · gabrielvigil-mixpanel · Mar 20, 2026 · Dec 19, 2025 · Dec 19, 2025 · Dec 19, 2025
@@ -67,6 +67,13 @@ If you're making a diagram, please add it to this [Figjam](https://www.figma.com
 
 Images are hard to keep up-to-date, so please use them judiciously.
 
+# Adding Youtube Videos
+
+Youtube videos are added through an iframe that embeds the video to the page.
+You can get the source of the video by going to the youtube video, selecting share then the embed option.
+
+Ensure you add `-nocookie` to the url (eg: `https://www.youtube-nocookie.com/embed/sRQCfmvh3vg`) otherwise the video will not work when user blocks cookies. (youtube tracks user data by default)
+
 # Previewing Changes
 
 All pull requests will generate a staging link in Vercel. Here's an [example](https://github.com/mixpanel/docs/pull/33#issuecomment-1520474996). This lets you preview your changes without changing what's actually live.

@@ -27,7 +27,7 @@ const getVideoEmbedURL = (videoURL) => {
     const host = parsedURL.host;
     if (host === "www.youtube.com" || host === "youtube.com" || host === "youtu.be") {
       const videoId = parsedURL.searchParams.get("v") || parsedURL.pathname.split("/").pop();
-      return `https://www.youtube.com/embed/${videoId}`;
+      return `https://www.youtube-nocookie.com/embed/${videoId}`;
     } else if (host === "www.loom.com" || host === "loom.com") {
       const videoId = parsedURL.pathname.split("/").pop();
       return `https://www.loom.com/embed/${videoId}?hideEmbedTopBar=true`;

@@ -0,0 +1,33 @@
+export function TrustArcHeadScripts() {
+    const trustArcAutoBlockCoreSrc = `https://consent.trustarc.com/v2/autoblockasset/core.min.js?cmId=9iv2en`;
+    const trustArcAutoBlockSrc = `https://consent.trustarc.com/v2/autoblock?cmId=9iv2en`;
+    const trustArcInitScriptSrc = `https://consent.trustarc.com/v2/notice/9iv2en?pcookie`;
+
+    return (
+        <>
+            <script src={trustArcAutoBlockCoreSrc} />
+            <script src={trustArcAutoBlockSrc} />
+            <script type="text/javascript" async src={trustArcInitScriptSrc} />
+        </>
+    );
+}
+
+export function TrustArcBodyScripts() {
+    const reloadOnPreferencesScript = `var _STATE={};function runOnce(){!_STATE.hasRunOnce&&window.truste&&truste.eu&&truste.eu.prefclose&&(_STATE.oldValue=truste.eu.bindMap.prefCookie&&truste.eu.bindMap.prefCookie.split(":")[0].replace(/[^\\d.]/g,"-"),_STATE.oldMethod=truste.eu.prefclose,truste.eu.prefclose=function(){_STATE.oldMethod(),truste.eu.bindMap.prefCookie&&truste.eu.bindMap.prefCookie.split(":")[0].replace(/[^\\d.]/g,"-")!==_STATE.oldValue&&setTimeout(function(){window.location.reload()},20)},_STATE.hasRunOnce=!0,_STATE.i&&clearInterval(_STATE.i))}_STATE.i=setInterval(runOnce,10);`;
+
+    const reloadOnBannerScript = `document.body.addEventListener("click",function(t){t&&t.target&&("truste-consent-button"===t.target.id||"truste-consent-required"===t.target.id)&&setTimeout(function(){window.location.reload()},1e3)});`;
+
+    return (
+        <>
+            <script
+                async
+                // eslint-disable-next-line @typescript-eslint/naming-convention
+                dangerouslySetInnerHTML={{ __html: reloadOnBannerScript }}
+            />
+            <script
+                // eslint-disable-next-line @typescript-eslint/naming-convention
+                dangerouslySetInnerHTML={{ __html: reloadOnPreferencesScript }}
+            />
+        </>
+    );
+}
@@ -15,6 +15,14 @@ type VideoButtonModalProps = {
 const PLAY_BUTTON_BASE_CLASS =
   "nx-flex nx-items-center nx-px-2 nx-py-1 nx-text-xs nx-font-semibold nx-text-purple140 nx-shadow-sm focus-visible:nx-outline focus-visible:nx-outline-2 focus-visible:nx-outline-offset-2 focus-visible:nx-outline-purple140";
 
+function getLoomShareURL(embedURL: string): string | null {
+  if (!embedURL.includes("loom.com")) {
+    return null;
+  }
+  // Convert loom.com/embed/VIDEO_ID to loom.com/share/VIDEO_ID
+  return embedURL.replace("/embed/", "/share/");
+}
+
 export default function VideoButtonWithModal({
   title = "Video about this feature",
   showThumbnail = true,
@@ -23,6 +31,23 @@ export default function VideoButtonWithModal({
   const embedURL = getVideoEmbedURL(props.src);
   let [isOpen, setIsOpen] = useState(false);
 
+  // If it's a Loom URL, return a simple link instead of the modal
+  const loomShareURL = getLoomShareURL(embedURL);
+  if (loomShareURL) {
+    return (
+      <p style={{ marginTop: "1.5rem" }}>
+        <a 
+          href={loomShareURL} 
+          target="_blank" 
+          rel="noopener noreferrer"
+          className="nextra-focus _text-primary-600 _underline hover:_no-underline _decoration-from-font [text-underline-position:from-font]"
+        >
+          Link to Demo
+        </a>
+      </p>
+    );
+  }
+
   // TODO: update this style and abstract it as time allows to a single button component
   // https://www.figma.com/design/8kiticjQNChvsP9y7s9SRf/Product-Releases-(Copy)?node-id=982-75355&node-type=frame&t=O7vwnwoAoOx42stw-0
   const playButtonClass = showThumbnail

@@ -7,7 +7,7 @@ const getYoutubeEmbedURL = (url: string) => {
   const videoId = url.split("v=")[1]
     ? url.split("v=")[1].split("&")[0]
     : url.split("/").pop();
-  return `https://www.youtube.com/embed/${videoId}`;
+  return `https://www.youtube-nocookie.com/embed/${videoId}`;
 };
 
 const getLoomEmbedURL = (url: string) => {

@@ -1,10 +1,12 @@
 import { Html, Head, Main, NextScript } from "next/document";
-import Script from "next/script";
+import { TrustArcHeadScripts, TrustArcBodyScripts } from "../components/TrustArcScripts/TrustArcScripts";
 
 export default function Document() {
   return (
     <Html>
-      <Head />
+      <Head>
+        <TrustArcHeadScripts />
+      </Head>
       <body>
         <Main />
         <NextScript />
@@ -52,6 +54,10 @@ export default function Document() {
         </script>
         {/* Empty script tag as chrome bug fix, see https://stackoverflow.com/a/42969608/943337 */}
         <script> </script>
+        {/* Trustarc - body scripts are to refresh page when user changes preferences. Removed at request of legal. Could be necessary for GDPR*/}
+        {/* <TrustArcBodyScripts /> */}
+        <div id="consent-banner"></div>
+        {/* end Trustarc */}
       </body>
     </Html>
   );

@@ -9,7 +9,9 @@ date: "2023-03-29"
 
 We’ve revamped Custom Alerts to make it easier for you to notify your team when a metric significantly changes.
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}><iframe src="https://www.loom.com/embed/2feb00896e90458e8d085495a2e62f14" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}></iframe></div>
+[Link to Demo](https://www.loom.com/share/2feb00896e90458e8d085495a2e62f14)
+
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}><iframe src="https://www.loom.com/embed/2feb00896e90458e8d085495a2e62f14" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}></iframe></div> */}
 
 With just one click, you can set up Slack or email alerts for:
 

@@ -6,7 +6,9 @@ date: "2023-04-06"
 
 With Mixpanel’s revamped Tables report, you can compare your key metrics side-by-side to understand how your segments are performing.
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}><iframe src="https://www.loom.com/embed/f3e4791604fb48f9bfad4bee2021decf" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}></iframe></div>
+[Link to Demo](https://www.loom.com/share/f3e4791604fb48f9bfad4bee2021decf)
+
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}><iframe src="https://www.loom.com/embed/f3e4791604fb48f9bfad4bee2021decf" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}></iframe></div> */}
 
 Tables are often the best visualization to process a lot of data at once — so, we made sure to include controls that can quickly get you to the most readable layout, fast:
 

@@ -6,13 +6,14 @@ date: "2023-04-14"
 
 Our new Discover feature makes it easier to explore popular analyses to springboard your own work. The Discover page automatically surfaces top analyses and creators and provides more search controls to filter reports & Boards.
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+[Link to Demo](https://www.loom.com/share/5353fc9abb624e2685d787f43b003dc2)
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/5353fc9abb624e2685d787f43b003dc2"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
 
 Here are a few ways to use Discover:
 

@@ -7,21 +7,25 @@ updatedAt: "2023-05-05T17:39:02.165Z"
 date: "2023-05-05"
 ---
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+[Anomaly Detection Demo](https://www.loom.com/share/572a0f59d22e43069ba0c3bc1b4210f4)
+
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/572a0f59d22e43069ba0c3bc1b4210f4"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Root Cause Analysis Demo](https://www.loom.com/share/53fd92c89b394e0c92324a4515e88443)
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/53fd92c89b394e0c92324a4515e88443"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
 
 Introducing Anomaly Detection and Root Cause Analysis, two new features to help you save time staying on top of metrics and getting ahead of potential issues in your product, data, or company.
 

@@ -7,14 +7,15 @@ updatedAt: "2023-06-01T17:39:02.165Z"
 date: "2023-06-01"
 ---
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/afa48331dd3f44deb3f4e63327bf2389"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
 
+[Link to Demo](https://www.loom.com/share/afa48331dd3f44deb3f4e63327bf2389)
 
 Our new data governance setting ensures that only trustworthy data is surfaced to your team. Event Approval allows you to hide newly tracked events by default, and notify admins of these new events.
 

@@ -7,13 +7,15 @@ updatedAt: "2023-06-01T14:45:02.165Z"
 date: "2023-06-07"
 ---
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/c0cc228cb4bc4e6c8ce25084178f8d30"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/c0cc228cb4bc4e6c8ce25084178f8d30)
 
 Actions speak louder than demographics, especially when it comes to finding what behaviors lead users to key outcomes. 
 

@@ -24,10 +24,12 @@ Getting the answer to this question can help inform a product offering strategy,
 
 If you want to learn more about how Cart Analysis can upgrade your ecommerce analytics, read our help doc on the [List of Objects data type](/docs/data-structure/property-reference/data-type#list-of-objects), the [analysis unlocked with List of Objects](/docs/data-structure/property-reference/data-type#list-of-objects-property-support) , and watch the demo video below. 
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/ff350b78206a4eb6948f86ed67e62ac3"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/ff350b78206a4eb6948f86ed67e62ac3)
@@ -7,13 +7,15 @@ updatedAt: "2023-08-10T17:39:02.165Z"
 date: "2023-08-10"
 ---
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/04f4ea75310744cdab477e1b47684db3?sid=ae77291d-d61a-4f91-9be0-887206896b18"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/04f4ea75310744cdab477e1b47684db3?sid=ae77291d-d61a-4f91-9be0-887206896b18)
 
 Today, all customers have access to Warehouse Connectors, which allows you to natively import data from Snowflake or BigQuery into Mixpanel. With this feature, you can set up recurring syncs from your data warehouse and ensure that Mixpanel is always in sync with your trusted data.
 

@@ -7,13 +7,15 @@ updatedAt: "2023-08-30T14:59:02.165Z"
 date: "2023-08-30"
 ---
 
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/d68d2f2f213144d8817d414eddd88f46?sid=04b74494-7aea-4eb7-aeb3-943e41ac7ec3"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/d68d2f2f213144d8817d414eddd88f46?sid=04b74494-7aea-4eb7-aeb3-943e41ac7ec3)
 
 Our latest data governance improvement makes it easier to investigate and fix data discrepancies, with peace of mind that you’re not disrupting your team’s workflows.
 

@@ -6,13 +6,16 @@ createdAt: "2023-09-25T14:59:02.165Z"
 updatedAt: "2023-09-25T14:59:02.165Z"
 date: "2023-09-25"
 ---
-<div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
+
+{/* <div style={{position: 'relative', paddingBottom: '64.90384615384616%', height: 0}}>
     <iframe src="https://www.loom.com/embed/f0d467f6b10247838f2edac6e8e4fca4"
         frameBorder="0"
         webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
         style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/f0d467f6b10247838f2edac6e8e4fca4)
 
 Recently, we worked on improving upon some of the core workflows you could do in our Insights report. Some of these changes added metric building functionality that open up new analysis possibilities, and some of these changes refreshed existing workflows to help Mixpanel become simpler to use - all in all, we’ve working hard to polish our existing workflows and setup Mixpanel’s design for long term success. 
 

@@ -6,7 +6,10 @@ createdAt: "2023-10-04T14:59:02.165Z"
 updatedAt: "2023-10-04T14:59:02.165Z"
 date: "2023-10-04"
 ---
-<div style={{position: "relative", paddingBottom: "56.25%", height: 0}}><iframe src="https://www.loom.com/embed/76f4658dd850457e9634c706ee0d9430?sid=2cc72a2a-ca9b-406e-80d3-86500a29f48e" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%"}}></iframe></div>
+
+{/* <div style={{position: "relative", paddingBottom: "56.25%", height: 0}}><iframe src="https://www.loom.com/embed/76f4658dd850457e9634c706ee0d9430?sid=2cc72a2a-ca9b-406e-80d3-86500a29f48e" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%"}}></iframe></div> */}
+
+[Link to Demo](https://www.loom.com/share/76f4658dd850457e9634c706ee0d9430?sid=2cc72a2a-ca9b-406e-80d3-86500a29f48e)
 
 Today, all customers can leverage Warehouse Connectors to import data via Redshift, in addition to Snowflake and BigQuery. You can set up recurring syncs from Redshift and ensure that Mixpanel is always in sync with your trusted data. You can import event, User, and Group profile data. 
 

@@ -7,7 +7,9 @@ updatedAt: "2023-10-20T14:59:02.165Z"
 date: "2023-10-20"
 ---
 
-<div style={{position: "relative", paddingBottom: "56.25%", height: 0}}><iframe src="https://www.loom.com/embed/9d992239e7ba498a99ae3442cd639b8d?sid=abff6216-3323-4811-9d67-bb31037d87c9" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%"}}></iframe></div>
+{/* <div style={{position: "relative", paddingBottom: "56.25%", height: 0}}><iframe src="https://www.loom.com/embed/9d992239e7ba498a99ae3442cd639b8d?sid=abff6216-3323-4811-9d67-bb31037d87c9" frameBorder="0" webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen style={{position: "absolute", top: 0, left: 0, width: "100%", height: "100%"}}></iframe></div> */}
+
+[Link to Demo](https://www.loom.com/share/9d992239e7ba498a99ae3442cd639b8d?sid=abff6216-3323-4811-9d67-bb31037d87c9)
 
 Our new report iteration workflow makes it easier to explore existing reports and save new iterations, through simplified duplication, clearer permissions, and better auto-naming. It’s now faster to build on existing work or go down exploratory deep-dives without losing your flow.
 

@@ -6,13 +6,16 @@ createdAt: "2023-11-07T14:59:02.165Z"
 updatedAt: "2023-11-07T14:59:02.165Z"
 date: "2023-11-07"
 ---
-<div style={{position: 'relative', paddingBottom: '56.25%', height: 0}}>
+
+{/* <div style={{position: 'relative', paddingBottom: '56.25%', height: 0}}>
   <iframe src="https://www.loom.com/embed/56a21b31e75342498317cbb6f31285eb?sid=5cd6c82c-87d4-48c3-9f19-1e44b8327923" 
     frameborder="0" 
     webkitallowfullscreen="true" mozallowfullscreen="true" allowFullScreen
     style={{position: 'absolute', 'top': 0, 'left': 0, 'width': '100%', 'height': '100%'}}>
     </iframe>
-</div>
+</div> */}
+
+[Link to Demo](https://www.loom.com/share/56a21b31e75342498317cbb6f31285eb?sid=5cd6c82c-87d4-48c3-9f19-1e44b8327923)
 
 Today, all customers can leverage Warehouse Connectors to import data via Databricks, in addition to Snowflake, BigQuery, and Redshift. You can set up recurring syncs from Databricks and ensure that Mixpanel is always in sync with your trusted data. You can import event, User, Group profile, and lookup table data.