Jupyter Notebook to WordPress conversion

The Jupyter Notebook is an open-source web-utility that lets user share documentation including are live code, equations, visualizations along the narrative text. The name, Jupyter, comes from the core supported programming languages: Julia, Python, and R. Notebook ships with the IPython kernel by default. The Jupyter Notebook is quite useful for learning, teaching, and data sharing. Google and Microsoft both have their own version of the Notebook that one can use to create and share your Notebooks at Google Colaboratory and Microsoft Azure Notebooks respectively.

Converting Data from Jupyter Notebook

While working with Jupyter Notebooks, many times it is required to share results with non-technical people. In such situations, one can use the nbconvert  which comes with Jupyter Notebook to convert or export the Notebook into one of the following formats:

• HTML
• LaTeX
• PDF
• RevealJS
• Markdown
• ReStructured Text
• Executable script

The nbconvert tool uses Jinja templates under the covers to convert your Notebook files (.ipynb) into these other formats.

The WordPress need

nbconvert tool is flawless to generate documentation in the different output formats, but I wanted to use the output with a WordPress blog. The output of nbconvert is a complete page with its own CSS. I needed to use default WordPress CSS along with its editor. So It was required to generate an HTML with wp-classes. without head or body tags. only the content that can be directly pasted in the HTML box in WordPress editor. Also, the focus was to keep the code colored to make it aesthetically appealing.

Article will be periodically updated as code progresses. Find the source code at: https://github.com/Techniex/ipynb2html

Example

Below this paragraph the content is directly pasted in htm box generated from test_jupyter.ipynb file.

This is the main heading [H2]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis non hendrerit lectus, eu blandit massa. Sed ex tortor, cursus non dui sit amet, ullamcorper pulvinar mi. Nam accumsan est at tellus vestibulum, ut bibendum nibh ultrices. Nam varius bibendum turpis. Vivamus enim neque, consectetur non tempor vel, pellentesque et velit. Phasellus varius neque neque. Nulla quis erat sit amet nisl maximus tristique vel non velit. Integer sit amet pretium quam. Cras semper lectus a urna scelerisque, eget volutpat ante vestibulum. Etiam vel metus augue. Ut ultricies, metus eu ullamcorper ultrices, enim sapien viverra diam, sed imperdiet enim tellus at quam. Duis volutpat metus nec ultrices congue. Donec accumsan viverra ante, quis sodales justo sollicitudin ac. Integer dui mi, condimentum a lacus id, rhoncus sollicitudin felis. Vestibulum massa risus, euismod sit amet semper sit amet, pellentesque in nunc.

Another Heading [H2]

Sub-heading [H3]

Sub-heading for Ordered list [H4]

1. Suspendisse maximus diam sodales sem tempor, at fermentum leo blandit.
2. Donec lorem est, tempor sit amet diam quis, fermentum efficitur diam.
   1. Aliquam ultricies, arcu at lobortis bibendum, orci mauris placerat libero, at mattis metus dolor eu est.
   2. Proin arcu urna, iaculis quis aliquam a, tristique nec neque.
3. Ut dictum quis quam quis congue.

Subheading for blockquote [H5]

Cras ultricies nisl elit, in commodo sem lobortis egestas.

Subheading for Unordered List [H6]

• Quisque accumsan diam in dolor volutpat, eget porta dui cursus.
• Curabitur viverra mollis leo, sit amet facilisis enim scelerisque ut.
• Vestibulum turpis nulla, cursus a auctor sed, consequat euismod leo.

  Nunc elementum massa nec lacus fringilla pellentesque.

• Integer sit amet mi varius, rhoncus justo non, imperdiet massa.
  • Suspendisse malesuada interdum elementum.

    Nullam eleifend dignissim eros.

  • Nulla ut commodo felis.
• Cras a interdum nunc.

Simple code example [H2]

2+3

5

Plot Example [H2]

x= [1,2,3,4]
y= [5,6,7,8]
import matplotlib.pyplot as plt
plt.plot(x,y)

Table Example [H2]

import pandas as pd
data = [['Alex',10],['Bob',12],['Clarke',13]]
df = pd.DataFrame(data,columns=['Name','Age'])
df