Month: April 2019

Including a Jupyter Notebook file on WordPress

I’ve been exploring different mechanisms to post Python Jupyter notebook files on WordPress. Of course, I can use nbconvert to convert my notebook files to other formats – including HTML – right from the command line. I can then post this file as part of an embedded HTML block in a WordPress post. However, this sounded like an unnecessary step, since I also wanted the notebook to be available in GitHub. I did not want to deal with generating this HTML file AND also managing a published notebook on GitLab as well. Smells a lot like duplicate efforts, wasted time. Thanks to a great WordPress plugin from Andy Challis, called nbconvert, I was able to achieve what I wanted! See his page at https://www.andrewchallis.co.uk/portfolio/php-nbconvert-a-wordpress-plugin-for-jupyter-notebooks/ for complete instructions.

  1. If you haven’t yet, you must install WP Pusher as a plugin in your WordPress site. (See this for more info.)
  2. Go to his web page for nbconvert, copy the CSS custom code displayed on the page.
  3. Go to your WordPress page, and add the custom CSS displayed on the page above into Appearance -> Customize -> Additonal CSS
  4. Go to https://github.com/ghandic/nbconvert and verify the latest instructions. Install the nbconvert shortcode plugin through WP Pusher. Activate it.
  5. That’s it!

Follow the instructions to include your own Jupyter notebook file available on GitHub.

Example

Here is an example. In a standalone text (or paragraph) block, I included the following shortcode:

[nbconvert url="https://github.com/bkingcs/python_snippets/blob/master/clustering/hierarchical.ipynb" /]

This generates the following:

Moving to WordPress

So, you’re interested in contributing some code back to the wonderful Internet community. Well, your first stop should surely be Github. If you’ve been a student in Computer Science, or pretty much any discipline where you need some code or libraries to accomplish some task, then surely you know that 1) Github is your primary go-to, and 2) you better have set up an account, and started sharing some examples of code for your future employers and collaborators to see what you do.

For some of us, however, we want access to a platform that can give us a bit more flexibility to be able to be a bit more reflective and educational with the code we share, and not simply just share code. And, of course there are dozens of options out there for doing that as well. For me, I spent years just managing my own site using Adobe Dreamweaver. However, it was becoming a bit overkill for what I was trying to achieve. I’ve used WordPress for various classes I teach, but not for my own endeavors. Well, as of 2019, that has changed. I narrowed down my search between Medium and WordPress, and concluded that both would have worked. However, I ultimately decided on WordPress due to convincing myself that it had a bit more flexibility to do some cool things.

Plugins

At some point, I’ll start a log of plugins I use…

There is one plugin that is one of my favs…

WP Pusher

One plugin I’ll mention right off the bat is WP Pusher. While WordPress manages a pretty rich set of plugins, some developers have complained that it takes a bit of time to get their plugins available through their API. Also, you’ll quickly notice that there are a lot of outdated plugins still available that may not necessarily work properly on your version of WordPress. Instead, you can deploy plugins directly from GitHub, Bitbucket or GitLab.

It’s quite simple to install WP Pusher:

  1. Go to WP Pusher
  2. Download the zip file (wppusher.zip).
  3. Go to your WordPress dashboard, and select Plugins -> Add Plugins -> Upload Plugin. Upload your zip file.
  4. Activate it!

You should now notice that you have a new menu item available called WP Pusher.

That’s it! Find a WordPress plugin on GitHub, and readily install it using WP Pusher! All plugins you install and activate from WP Pusher will then be available and managed from your standard Plugin interface. Very cool.