From 00d3fd1f12d864c224dfe91220616be8fcf26ffc Mon Sep 17 00:00:00 2001 From: Freek Pols Date: Wed, 29 May 2024 09:58:54 +0200 Subject: [PATCH] included different options to embed videos --- book/basic-features/recipes.md | 58 +++++++++++++++++++--------------- 1 file changed, 33 insertions(+), 25 deletions(-) diff --git a/book/basic-features/recipes.md b/book/basic-features/recipes.md index 7e8b9ba..eaa8af4 100644 --- a/book/basic-features/recipes.md +++ b/book/basic-features/recipes.md @@ -16,25 +16,26 @@ You can find more documentation on including figures [here](https://jupyterbook. ## Videos +--- +jupytext: + text_representation: + extension: .md + format_name: myst + format_version: 0.13 + jupytext_version: 1.10.3 +kernelspec: + display_name: Python 3 (ipykernel) + language: python + name: python3 +--- + +## Videos + Videos uploaded to YouTube can be embedded in the Jupyter Book. There are several ways to do so: -1. To embed them in the Jupyter Book, first obtain the embedding link of the video. In order to do so, go to the *YouTube* page of the video (so not the Brightspace page), then click *share* in the description box. There should be a button *embed*, click that. Copy the HTML code that appears in the panel. Then, to embed the video, use the following +**1.** To embed them in the Jupyter Book, first obtain the embedding link of the video. In order to do so, go to the *YouTube* page of the video (so not the Brightspace page), then click *share* in the description box. There should be a button *embed*, click that. Copy the HTML code that appears in the panel. Then, to embed the video, use the following - ```{eval-rst} - .. raw:: html - - - ``` - -**Example:** -```{eval-rst} -.. raw:: html - - ``` - -2. The embedding code can be included using the iframe directly: -```{code-cell} ``` -Resulting in the video below: + +This HTML-iframe code can be directly included in the markdown file (no need to create a code-cell). + +Resulting in the video below:
-3. The above solution can be 'upgraded', setting a scaling of the video with the width of the screen and align it to the center: -```{code-cell} +**2.** The above solution can be 'upgraded', setting a scaling of the video with the width of the screen and align it to the center: +```
-
+ > +
-4. Another option is to use a python coding cell. As this code cell should be run when the book is made, you have to change the config file and set `execute_notebooks:` to force. This comes with the downside that it takes considerable more time to deploy the book. - +**3.** Another option is to use a python coding cell. As this code cell should be run when the book is made, you have to change the config file and set `execute_notebooks:` to force. This comes with the downside that it takes considerable more time to deploy the book. +```` ```{code-cell} ipython3 :tags: [remove-input] from IPython.display import YouTubeVideo VideoWidth=600 YouTubeVideo("YDBr1Lof_mI", width=VideoWidth, align='center') ``` +```` Moreover, it requires one to have this code at the top of your markdown file: - +``` --- jupytext: text_representation: @@ -104,6 +109,9 @@ Moreover, it requires one to have this code at the top of your markdown file: language: python name: python3 --- +``` +Note that this is not needed when you use a .ipynb (jupyter notebook) file. + ## Equations