summary: - adds prettier formatter configuration - formats the entire repo using prettier, ignoring minified files (`*.min.css`) and heavy generated html - changes extensions of all `.html` files to `.liquid`, which is more correct and necessary for prettier to work correctly - replaces "%-" and "-%" with just "%" — manual liquid formatting using minus signs is superfluous since we are compressing and minifying the code anyway - adds CI action for running prettier check on PR and pushes to master
2.2 KiB
| layout | title | date | description | tags | categories | giscus_comments | related_posts |
|---|---|---|---|---|---|---|---|
| post | a post with jupyter notebook | 2023-07-04 08:57:00-0400 | an example of a blog post with jupyter notebook | formatting jupyter | sample-posts | true | false |
To include a jupyter notebook in a post, you can use the following code:
{% raw %}
{::nomarkdown} {% assign jupyter_path = "assets/jupyter/blog.ipynb" | relative_url %} {% capture notebook_exists %}{% file_exists
assets/jupyter/blog.ipynb %}{% endcapture %} {% if notebook_exists == "true" %} {% jupyter_notebook jupyter_path %} {% else %}
<p>Sorry, the notebook you are looking for does not exist.</p>
{% endif %} {:/nomarkdown}
{% endraw %}
Let's break it down: this is possible thanks to Jekyll Jupyter Notebook plugin that allows you to embed jupyter notebooks in your posts. It basically calls jupyter nbconvert --to html to convert the notebook to an html page and then includes it in the post. Since Kramdown is the default Markdown renderer for Jekyll, we need to surround the call to the plugin with the ::nomarkdown tag so that it stops processing this part with Kramdown and outputs the content as-is.
The plugin takes as input the path to the notebook, but it assumes the file exists. If you want to check if the file exists before calling the plugin, you can use the file_exists filter. This avoids getting a 404 error from the plugin and ending up displaying the main page inside of it instead. If the file does not exist, you can output a message to the user. The code displayed above outputs the following:
{::nomarkdown} {% assign jupyter_path = "assets/jupyter/blog.ipynb" | relative_url %} {% capture notebook_exists %}{% file_exists assets/jupyter/blog.ipynb %}{% endcapture %} {% if notebook_exists == "true" %} {% jupyter_notebook jupyter_path %} {% else %}
Sorry, the notebook you are looking for does not exist.
{% endif %} {:/nomarkdown}Note that the jupyter notebook supports both light and dark themes.