No slide notes on a title slide in reveal.js

[jaen]

Issues #3993 and #1618 describe issues with speaker notes on title slides. As mentioned in #3993 --slide-level=2 solves the issue with speaker note breaking header level recognition, but the notes themselves don't appear in the output document on the title slide. As far as I understand this was done in the name of uniformity between different presentation output formats, but this makes for a somewhat awkward situation where you can't leave any tips for yourself on the title slide.

Is there anything that can be done to get slide notes on title slides save for manually adjusting slides afterwards?

[jgm]

Do the notes appear somewhere else than with the title slide? Or do they just not appear at all? We could probably special-case this to get it to work. Seems like an important feature.

[jaen]

They don't seem to appear at all. For example this Pandoc markdown document:

# Main header

::: notes
Main header notes
:::

## Subheader 1

::: notes
Subheader 1 notes
:::

## Subheader 2

::: notes
Subheader  notes
:::

when rendered with --slide-level=2 -t revealjs produces the following:

<section>
    <section id="main-header" class="title-slide slide level1">
        <h1>Main header</h1>
        <!-- notes missing here -->
    </section>
    <section id="subheader-1" class="slide level2">
        <h2>Subheader 1</h2>
        <aside class="notes">
            <p>Subheader 1 notes</p>
        </aside>
    </section>
    <section id="subheader-2" class="slide level2">
        <h2>Subheader 2</h2>
        <aside class="notes">
            <p>Subheader notes</p>
        </aside>
    </section>
</section>

where I would have expected something like this instead:

<section>
    <section id="main-header" class="title-slide slide level1">
        <h1>Main header</h1>
        <aside class="notes">
            <p>Main header notes</p>
        </aside>
    </section>
    <section id="subheader-1" class="slide level2">
        <h2>Subheader 1</h2>
        <aside class="notes">
            <p>Subheader 1 notes</p>
        </aside>
    </section>
    <section id="subheader-2" class="slide level2">
        <h2>Subheader 2</h2>
        <aside class="notes">
            <p>Subheader notes</p>
        </aside>
    </section>
</section>

Trying to work around this by using HTML doesn't work either – it seems Pandoc throws any content on the title slide away.

[edi9999]

Same issue for me, notes do not appear in title slides. (pandoc 2.6)

[lassepe]

I am somewhat confused by the title of this issue and the fact that it is closed. This discussion only referred to "level-1" slides, right? Or does the fix in 5990f14 also allow to places speaker notes on the title slide (the very first slide that is essentially generated from the yaml header data title, subtitle, author, etc.? If so, where to add speaker notes for the title slide? Is there a yaml header field for this?

[jgm]

"Title slides" may be a bit confusing; it refers to the slides that just contain the section headings at the top of 2D columns. I don't know if there's a way to do speaker notes on the title of the slide show.

[fkohrt]

I don't know if there's a way to do speaker notes on the title of the slide show.

@lassepe @jgm In case you are interested, this is indeed possible using Pandoc's title-slide-attributes in combination with Reveal.js' data-notes. For example, to add the equivalent of the following markdown as speaker notes on the very first slide of your presentation...

__Why does the sigla frequently overfesk the trelsum?__

- All siglas are mellious.
- Siglas are always votial.
- The trelsum is usually tarious.
- No trelsa are directly feskable.

...add the following to your preamble:

title-slide-attributes:
  data-notes: '<p><strong>Why does the sigla frequently overfesk the trelsum?</strong></p><ul><li class='fragment'>All siglas are mellious.</li><li class='fragment'>Siglas are always votial.</li><li class='fragment'>The trelsum is usually tarious.</li><li class='fragment'>No trelsa are directly feskable.</li></ul>'

It's a bit fiddly as you have to manually convert the Markdown above into HTML and then substitute

• & → &
• < → <
• > → >
• " → '

Finally, wrap everything into single quotation marks (') – and don't use them elsewhere.

[stoufa]

@fkohrt's approach worked for me - at first - but then the notes on the title slide disappeared. I'm not sure what has happened since then. However, to fix this, I used a quick and dirty method, which I'm sharing here as a temporary workaround.

I added the following <script> element before </body> using the --include-after-body=footer.html argument in pandoc, this snippet creates an aside.notes element inside the #title-slide element and set its content to the value in the data-notes attribute.

<!-- footer.html -->

<script>
  /**
   * @param {String} HTML representing a single element
   * @return {Element}
   */
  function htmlToElement(html) {
    var template = document.createElement('template');
    html = html.trim(); // Never return a text node of whitespace as the result
    template.innerHTML = html;
    return template.content.firstChild;
  }

  const title_slide = document.querySelector('#title-slide');
  let data_notes = title_slide.getAttribute('data-notes');
  data_notes = data_notes ? data_notes : ''; // replace data_notes with an empty string if it's null
  const html_template = `<aside class="notes">${data_notes}</aside>`;
  const notes_dom_object = htmlToElement(html_template);
  title_slide.appendChild(notes_dom_object);
</script>

<!--
I found the function htmlToElement(HTML) in the following StackOverflow thread:
stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro
-->