Skip to main content

Export Jupyter notebooks to a Hugo compatible format

Project description

# Export Notebooks To Hugo Compatible Markdown

## Basic Installation and Use
```
pip install nbhugoexporter
```
will install the exporter. You will also need to add some shortcode definitions
to Hugo. You can customize these as you wish, but an easy way to get started is
to run the following from the root of your Hugo project:
```
mkdir -p layouts/shortcodes
for x in cell input; do for y in start end;
do curl -L https://github.com/jbandlow/nb_hugo_exporter/raw/master/resources/jupyter_$x\_$y.html > layouts/shortcodes/jupyter_$x\_$y.html;
done; done;
```

You can then run the exporter with
```
python3 -m nbconvert path/to/nb_file.ipynb --to hugo --output-dir content/path/insert-title-here
```
This will create a `content/path/insert-title-here` directory with an
`index.md` file derived from `nb_file.ipynb`. The generated metadata will include
```
---
title: Nb File
date: <last file modification time for nb_file.ipynb>
draft: True
...
---
```
along with any other metadata you've specified. To set metadata, go to Edit ->
Edit Notebook Metadata from within your notebook, and add
```
"hugo": {
"key1": value1,
...
}
```
with whatever keys and values you wish. The `title` value will default to the
notebook filename with snake\_case replaced by Initial Caps. All auto-generated
values (`title`, `date`, and `draft`) can be overridden in the notebook
metadata.

The resulting markdown will contain the following hugo shortcodes:
```
{{% jupyter_cell_start [cell_type] }}
{{% jupyter_input_start }}
...
{{% jupyter_input_end }}
...
{{% jupyter_cell_end }}
```
in the places you'd expect. `[cell_type]` is the Jupyter cell type, e.g.,
`markdown`, `code`, etc. Code itself will have GitHub style code fences:

````
```python
import this
```
````

Set `pygmentsCodeFences` to `true` in your Hugo configuration file to use a
syntax highlighter. See the [hugo
documentation](https://gohugo.io/content-management/syntax-highlighting/) for
much more on this.

You may also want to enable the `noEmptyLineBeforeBlock` [BlackFriday
extension](https://gohugo.io/content-management/formats/#blackfriday-extensions).
Markdown in Jupyter is processed as though this setting were enabled.


## CSS configuration

You may also want to configure your CSS. The main design goal for this project
was to generate markdown that could be styled to my particular tastes. The
shortcodes are simply used to generate `div`s, and the corresponding classes are
then easy to style. With the shortcodes in this repo, the resulting HTML
looks like:

```
<div class="jupyter-cell [cell_type]">
<div class="jupyter-input"> ... </div>
...
</div>
```

In concert with styling the syntax highlighter, this can be
made to look more or less like Jupyter's own theme, or like anything else you
wish. Note that the exporter currently adds some unnecessary blank lines. These
can be cleaned up with

```
.jupyter-cell p:empty { display: none; }
```

## Latex

Finally, for LaTeX to render properly, you should [include the MathJax script](
https://gohugo.io/content-management/formats/#enable-mathjax) on your pages.
Note that `nbconvert --to hugo` solves the [underscore problem](
https://gohugo.io/content-management/formats/#issues-with-markdown) with the
"tedious" solution of simply quoting all underscores in math mode. So there is
no need for the MathJax configuration script that "fixes \<code\> tags" in your
Javascript, or the custom CSS described in that post.

That's it! Happy blogging with Jupyter notebooks and Hugo.

## Acknowledgements
Shout-out to the amazing [Hugo](https://gohugo.io), and
[Jupyter](https://jupyter.org) teams for building incredible tools.

For another approach to this issue, see
[hugo-jupyter](http://journalpanic.com/hugo_jupyter/), from [Stephan
Fitzpatrick](https://github.com/knowsuchagency). This didn't fully fit my needs,
but it might fit yours.


Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

nbhugoexporter-0.2.0.tar.gz (6.5 kB view details)

Uploaded Source

Built Distribution

nbhugoexporter-0.2.0-py3-none-any.whl (9.6 kB view details)

Uploaded Python 3

File details

Details for the file nbhugoexporter-0.2.0.tar.gz.

File metadata

  • Download URL: nbhugoexporter-0.2.0.tar.gz
  • Upload date:
  • Size: 6.5 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/1.11.0 pkginfo/1.4.2 requests/2.18.4 setuptools/36.5.0.post20170921 requests-toolbelt/0.8.0 tqdm/4.23.4 CPython/3.6.3

File hashes

Hashes for nbhugoexporter-0.2.0.tar.gz
Algorithm Hash digest
SHA256 4a7f465ff19c0735a099542f00812c04f1c806348c611159177c41f0edd408b4
MD5 a96c41a33c8f18f3477ed21c66e0e9a5
BLAKE2b-256 5291023e577bb23a59ff054a76f2afe5fda066638bc382857ed26a4e20d71657

See more details on using hashes here.

File details

Details for the file nbhugoexporter-0.2.0-py3-none-any.whl.

File metadata

  • Download URL: nbhugoexporter-0.2.0-py3-none-any.whl
  • Upload date:
  • Size: 9.6 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/1.11.0 pkginfo/1.4.2 requests/2.18.4 setuptools/36.5.0.post20170921 requests-toolbelt/0.8.0 tqdm/4.23.4 CPython/3.6.3

File hashes

Hashes for nbhugoexporter-0.2.0-py3-none-any.whl
Algorithm Hash digest
SHA256 676131854e7401265076d18f214580506a15c9fbbd53a411a5aab4561590f9bf
MD5 fb08d96b719870857eb15a1316b4d34e
BLAKE2b-256 f65b5f76bda1e5f58af329a1686ef5ba99463c2b4edf8ae2f23c679a911094a9

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page