Xaringan: Easy way to add footer / disable slide numbering

[ismayc]

I'd like to be able to add a footer with a link to my slides throughout my presentations instead of having the slide numbering feature. Is this doable?

Right now I just include this in each slide: .footer[These slides available at <http://bit.ly/myslides>]. Then I include this in the css file

.footer {
    color: black;
    position: fixed;
    top: 95%;
    left: 0;
    text-align: center;
    width: 100%;
}

Seems a little too hacky and inefficient. Also not sure how to turn off the slide numbering even with this hack.

[yihui]

You can certainly hide slide numbers via CSS, e.g. https://github.com/yihui/xaringan/wiki/Slide-number

Footers are not supported in remark.js AFAIK, but if you are moderately good at JavaScript, I believe there is a way for hacking using the showSlide event https://github.com/gnab/remark/wiki/Configuration combined with slide properties https://github.com/gnab/remark/wiki/Markdown#slide-properties

And after googling "remark.js footer" I got https://github.com/gnab/remark/issues/229

[ismayc]

Oh man! I didn't even see the slide number on the wiki. Sorry about that.

I did something similar to the gnab/remark#22 thing but it seems clunky. I'd like to just specify the following or something similar:

output: 
  xaringan::moon_reader:
    footer: These slides available at http://bit.ly/myslides
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
    css: example.css

Unfortunately, I don't know any JavaScript or how I could go about adding that to an R Markdown presentation. Do I put that in a file in the same folder as the Rmd? How do I tell R Markdown to look for that JavaScript code and use it?

[ismayc]

I think a good enough solution is to set layout to TRUE using the CSS in my original post. Then you can just have a slide at the start of the presenation that looks like

layout: true

.footer[These slides available at <http://bit.ly/myslides>]
---

This will put the footer on all of the subsequent slides in the presentation.

[yihui]

The wiki is very new, so definitely not your fault of oversight.

The solution is indeed very clunky. It will be nice if remark.js has built-in support for header/footer.

The way to append custom JavaScript code or any HTML content to slides is to use after_body under includes just like what you do for normal HTML documents: http://rmarkdown.rstudio.com/html_document_format.html#includes

IMHO although it is tempting to have header/footer on slides (especially if you come from the LaTeX beamer land), I don't feel they are very useful or informative. This is especially true for headers and footers that are global, i.e. they don't change throughout all slides. If something does not contain additional information, I'd just not repeat it over and over again. The idea is the same as chartjunk. For example, if you want to point out that your slides are available at http://bit.ly/myslides, you can probably do this after the title slide or on the very last slide.

[ismayc]

Thanks for the includes tip. I wasn't aware that JavaScript could be added in the same fashion as HTML.

My problem is that I frequently lead presentations where folks (frequently students that I don't trust to go back and review the slides after the fact) step in and out of the presentation or come in late. I used to always just put my slide link on the first slide and the last slide but was constantly asked for the link to the slides / heard folks in the audience asking others for the link during my presentation. The presentations also require that folks be up to speed on what I talked about previously. It's essentially like having a chalkboard that I need to erase.

I definitely agree that I'd rather not include the same thing on all slides and I'd prefer to reduce the amount of junk on my slides, but this work-around seems to work OK for me.

[yihui]

Okay, that is what I guessed. This reminds me of one of my professors in college who had the class policy "either come on time or just don't come" :)

[ismayc]

That's the policy I have with students in my own courses that I teach as well and it works nicely 👍 . The workshops and presentations I lead that have this problem are usually for other professors on a topic they'd like me to cover so I can't be quite as scornful with the students.

[jaredlander]

I know this is closed but I had success with this in the CSS file:

.remark-slide-content:after {
    content: "Footer text";
    position: absolute;
    bottom: 5px;
    right: 35px;
    height: 40px;
    width: 120px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("logo.png");
}

[pat-s]

FYI: I added a wiki entry for footer and header lines. Feel free to polish it up ;)

[tungmilan]

@jaredlander: your CSS does the job but slide number and logo appear on the title slide. I can remove the slide number but how can I remove the logo? Thanks!

.title-slide .remark-slide-number {
  display: none;
}