More YT videos in docs (#10623)

This PR adds a bunch of links to YT videos on pages where it makes
sense.

---------

Signed-off-by: vincent d warmerdam  <vincentwarmerdam@gmail.com>
Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Author: 3 people

docs/api/inputs/anywidget.md

@@ -9,6 +9,14 @@ creating custom Jupyter-compatible widgets. marimo supports anywidget, allowing
 you to import anywidget widgets or create your own custom widgets and use them
 in your notebooks and apps.
 
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/mRbsvcxE9vc"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
+
 ## Importing a widget
 
 You can use anywidgets that others have built, such as

docs/faq.md

@@ -509,7 +509,13 @@ code completion.
 
 ### How do I use marimo on a remote server?
 
-> We recorded a video tutorial on how to use marimo on a remote server. Check it out [here](https://youtu.be/pam9Hw8rbaA).
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/pam9Hw8rbaA"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
 
 Use SSH port-forwarding to run marimo on a remote server
 and connect to it from a browser on your local machine. Make sure

docs/getting_started/key_concepts.md

@@ -12,6 +12,14 @@ elements in a reproducible **notebook environment**.
   marimo notebooks can be shared as as **interactive web apps** and executed as
   **Python scripts**.
 
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/3dUagnSKaA8"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
+
 ## Editing notebooks
 
 marimo notebooks are **reactive**: they automatically react to your code

docs/getting_started/quickstart.md

@@ -173,12 +173,12 @@ Install the extension by searching "marimo" in the extensions sidebar
 (`Cmd/Ctrl-Shift-P`, type "install extension", then search "marimo")
 or from the [VS Code marketplace site](https://marketplace.visualstudio.com/items?itemName=marimo-team.vscode-marimo).
 
-<iframe width="560" height="315" src="https://www.youtube.com/embed/BOzK-XBK8A4" title="VSCode extension demo video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+<iframe width="560" height="315" src="https://www.youtube.com/embed/BOzK-XBK8A4" title="VSCode extension demo video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" loading="lazy" allowfullscreen></iframe>
 
 **PyCharm.** Our [PyCharm
 plugin](https://plugins.jetbrains.com/plugin/32416-marimo), available on the
 JetBrains Marketplace, brings the full marimo editor inside PyCharm, letting you open, edit, and
 run notebooks without leaving your IDE.
 
-<iframe width="560" height="315" src="https://www.youtube.com/embed/J4yD_W8xAL0" title="PyCharm plugin demo video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+<iframe width="560" height="315" src="https://www.youtube.com/embed/J4yD_W8xAL0" title="PyCharm plugin demo video" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" loading="lazy" allowfullscreen></iframe>
 

docs/guides/deploying/deploying_skypilot.md

@@ -7,6 +7,14 @@
 
 marimo notebooks work exceptionally well with SkyPilot because they are stored as pure Python scripts and can be run both interactively and as batch jobs. With marimo's built-in `uv` integration, your notebooks are fully reproducible across different environments.
 
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/JCVzYz8PrRQ"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
+
 ## Interactive Development
 
 For interactive development with marimo on a SkyPilot cluster, you can launch a cluster and connect to it with SSH port forwarding.

docs/guides/editor_features/ai_completion.md

@@ -100,7 +100,7 @@ The chat panel currently supports the following modes:
 
 ??? tip "See the chat panel in action"
 
-    <iframe width="740" height="420" src="https://www.youtube.com/embed/4DC1E2UBwAM?si=zzrzl0VlvOU6JiZP" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+    <iframe width="740" height="420" src="https://www.youtube.com/embed/4DC1E2UBwAM?si=zzrzl0VlvOU6JiZP" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" loading="lazy" allowfullscreen></iframe>
 
 ### Generating entire notebooks
 

docs/guides/exporting/quarto.md

@@ -9,6 +9,14 @@ including HTML, PDF, and Word.
 
 marimo's [Quarto extension](https://github.com/marimo-team/quarto-marimo) allows you to utilize Quarto on marimo's markdown format to produce interactive, reactive, webpages.
 
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/scuGmtv81S0"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
+
 !!! tip "Try the markdown file format tutorial"
     Learn more with `marimo tutorial markdown-format` at the command line.
 

docs/guides/generate_with_ai/marimo_pair.md

@@ -12,7 +12,7 @@ cells, add and remove cells, and even manipulate UI elements.
   src="https://www.youtube.com/embed/VKvjPJeNRPk?si=JMvoFiDFNtT1BsJY"
   title="YouTube video player" frameborder="0" allow="accelerometer; autoplay;
   clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+  referrerpolicy="strict-origin-when-cross-origin" loading="lazy" allowfullscreen></iframe>
 </div>
 
 ## Quickstart

docs/guides/publishing/github.md

@@ -96,6 +96,14 @@ code to molab to run and share there.
 You can publish executable notebooks to [GitHub Pages](https://pages.github.com/)
 for free, after exporting your notebook to a WebAssembly notebook.
 
+<div style="text-align: center">
+  <iframe width="100%" style="aspect-ratio: 16/9; max-width: 800px"
+  src="https://www.youtube.com/embed/m8bdgBidefA"
+  title="YouTube video player" loading="lazy" frameborder="0" allow="accelerometer; autoplay;
+  clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+  referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+</div>
+
 ### Export to WASM-powered HTML
 
 Export your notebook to a self-contained HTML file that runs using [WebAssembly](../wasm.md):

docs/guides/understanding_errors/multiple_definitions.md

@@ -16,7 +16,7 @@ is a loop variable (`i`), a dataframe (`df`), or a plot (`fig`, `ax`).
 ??? Tip "Watch our YouTube explainer"
 
     <div align="center">
-    <iframe width="700" height="393" src="https://www.youtube.com/embed/5TzAADGRfxU?si=ZtwQoAzEUL2UABNq" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+    <iframe width="700" height="393" src="https://www.youtube.com/embed/5TzAADGRfxU?si=ZtwQoAzEUL2UABNq" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" loading="lazy" allowfullscreen></iframe>
     </div>
 
 ## Why can't I redefine variables?