Create buttons to hide and run code

I work with a lot of practitioners who range from zero coding to good proficiency. Regardless, they all want to see the data workflow from dataset to output. Binder seems perfect and I am able to add ipywidgets for user input. However, I then need the users to be able to run the cell or look at the code. I am trying to turn each code cell into two buttons “Run Code” and “Show Code”

I have been unable to find a solution

Using the below solution just makes my code disappear


By any chance are you working in JupyterLab? If so, one idea would be to just show your users how to use the uncollapsing of code cells that is built-in. If you are working with recent JupyterLab, you can collapse all the code cells and when the notebook is reopened, the state will be respected. Then users can toggle individual ones to be visible. If they don’t want the code visible, they will still run. See here for more information about this feature of JupyterLab. This may empower your users more because it isn’t some custom solution that they won’t find elsewhere. And it is already inherent in the current version of the Jupyter interface.
Right now the default JupyterLab binder example isn’t building right, I can point you here where you can launch JupyterLab and test it.

@fomightez Thanks. However, I have to make sure it has a stable binder build and I am trying to keep it lighter without Node.js and npm.

I found this works, but it is still a little clunky, so I am blindly trying to see if I can customize it more.

I found a great solution here. That is working perfectly. At some point I will try and figure out how to add two buttons so I have a run button as well, but this is good for now.


Nice find. I knew there was something out there in the classic notebook closer to what you describe, but I couldn’t quite recall which one or where I saw it.
Related to the first clunky suggestion you found, there is also hide_code extension. I didn’t suggest it earlier because it doesn’t have buttons for individual cells as you seem targeted at. I’ve binderized it here.

To clarify a point in your first reply:
JupyterLab is stable on Binder. It is just the example is a little more full-featured than absolutely needed in order to really demonstrate it, and so it includes an extension. The extension is the issue right now. How extensions are handled is changing in the upcoming versions of JupyterLab, see here. After JupyterLab 3 extensions won’t require building JupyterLab. And I wonder if that also eliminates the absolute need for node and npm?
( I am also wondering if that is why JupyterLab Binder example repo hasn’t been addressed in earnest. When JupyterLab 3 comes out the extension system will be easier to deal with so why extend effort fixing the repo for the old version. But maybe it is purely a momentum thing.)

Also to demonstrate how stable JupyterLab is on Binder, you may not realize it comes along by default with standard Binder builds. You just have to change the URL and you can switch over from the classic to the Lab in most launched sessions, see here for how to edit the URL.

1 Like

The evolution of this:

1 Like