Printing Rmarkdown ioslides presentation with notes included

Question

I am going to be giving a presentation with quite a bit of R code, so I'm working on it using Rmarkdown. I settled on the ioslides_presentation format for various reasons, such as the available 2-column slide format, the ease of adding a logo, and the fact that it generally seems to be well-supported. Also, it had a straightforward format for presentation notes that are easy to view in a special "Presenter" window.

The issue that I'm running up against is that I'd like to distribute my slides after the presentation, including the presenter's notes. Of course, I can/will distribute the HTML version, but for those in my audience that are more PowerPoint-oriented, I would also like to have a more familiar PDF version. I'm therefore using Chrome to "Save to PDF", which appears to be the standard method. However, as best as I can tell, the default printing excludes notes:

And turning them on prior covers most of the main slide (background printing must be turned on in Chrome to see anything other than the notes, and it will turn on notes for all slides):

Is there any standard or reasonably straightforward way to fix this? My test Rmd file follows.

---
title: "Test Presentation"
output: ioslides_presentation
---

## First content slide

This is standard slide text, displayed by default.
Notes are only shown when "p" is pressed.

<div class="notes">
This is a note that shows when requested.
</div>

## Second slide
Here's a list that will fill some space.

- One
- Two
- Three
- Four
- Five
- Six
- Seven

<div class="notes">
Just another note.
</div>

Nick Nimchuk Nick Nimchuk · Accepted Answer · 2017-08-07T20:40:10

I know little-to-nothing about CSS, but I was able to tweak it a bit to look like this using a custom CSS file:

However, that also impacts the presentation mode (requiring a different version for the presentation versus the printout) and will potentially require a lot of manual tweaking to get the text size and location right relative to the main content.

Using the example code, the following can be inserted just before the ## First content slide line to reproduce my output:

<style>
  .note {
    top: 60%;
    height: 40%;
    background: rgba(0, 0, 0, 0.1);
    font-size: 50%;
  }
</style>

Printing Rmarkdown ioslides presentation with notes included

1 Answers