Hide the input cells from your IPython slides

2013-10-10 19:54 English | Código fuente | Minimap

A tweet arrived...

@damian_avila Is there a way to only show the output of a cell in an NB slideshow?
— Thomas Wiecki (@TWiecki) October 10, 2013

And my answer was YES...

How we can easily do it? Just follow these few steps:

Rational: We are going to use the power of IPython.nbconvert library to use a modified jinja template which will let us hide the input cells in our IPython slides. To achieve this goal, we are going to use the same approach described in a previous post. Hence, our input cells will be hidden by default, but they will show up if we click on the corresponding output cell area.

OK, I first wrote a custom template and named it as output_toggle.tpl:

In [1]:

!cat /media/datos/Ejemplos/output_toggle.tpl

{%- extends 'slides_reveal.tpl' -%}

{% block input_group -%}
<div class="input_hidden">
{{ super() }}
</div>
{% endblock input_group %}

{%- block header -%}
{{ super() }}

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<style type="text/css">
//div.output_wrapper {
//  margin-top: 0px;
//}
.input_hidden {
  display: none;
//  margin-top: 5px;
}
</style>

<script>
$(document).ready(function(){
  $(".output_wrapper").click(function(){
      $(this).prev('.input_hidden').slideToggle();
  });
})
</script>
{%- endblock header -%}

The code is simple, but for a detailed explanation see my previous post.

Briefly, I just changed obvious things such as the encompassing of the input_group and the calling of .prev() method (instead of .next() one) inside the little javascript snippet.

Now, the second and last step was:

ipython nbconvert your_slides.ipynb --to slides --template output_toggle --post serve

and I got something like this (navigate and try it!):

OK, as you have seen in the example, your IPython slides will be delivered showing just the output cells... but if you need to show some input cells, just click on the corresponding output cell and you will get them. Nice, uh!

Hope it helps Thomas (and all the other people using the IPython slides)!

Damián.

Did you like the content? Great!

Or visit my support page for more information.

Btw, don't forget this blog post is an ipynb file itself! So, you can download it from the "Source" link at the top of the post if you want to play with it ;-)