Multiple logos, on different slides?

[giabaio]

Hi all, Just a quick (hopefully!) question, mostly out of my ignorance of css... Is it possible to use use_logo repeatedly to change the logo? So, to be clearer, I have a set of slides I'm preparing when many speakers will talk - each from different institutions. So what I'd like to do is to be able to add the specific logo only in the slides that are relevant for a given speaker.

I think if I use multiple chunks pointing to different images, then the last one will take over and be included even when it shouldn't (on top of the "correct" one)? I suppose I could define a class for each speaker and the add all the "other" classes to the call to use_logo, but I was wondering whether there's a neater option?

Thanks! Gianluca

[gadenbuie]

Hi @giabaio ... unforunately use_logo() is designed around inserting one logo into all of the slides.

But the good news is that you can use plain CSS to accomplish something very similar:

Add this block to your slides (near the top) or add the CSS to a separate CSS file that you load in the css option of moon_reader in the YAML header:

```{css, echo=FALSE}
.with-logo::before {
	content: '';
	width: 110px;
	height: 126px;
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	background-size: contain;
	background-repeat: no-repeat;
}
.logo-dplyr::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/dplyr.png);
}
.logo-purrr::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/purrr.png);
}
.logo-plumber::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/plumber.png);
}
```

Change the names of the .logo- classes and the URLs of the images. Then, for each slide that needs a logo, add the with-logo class and the specific logo class, e.g. logo-dplyr.

Here's the complete source code for the example similar to the screenshot above.

---
title: Slides with Multiple Logos
output:
  xaringan::moon_reader:
    lib_dir: libs
    seal: false
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

class: center middle with-logo logo-dplyr

# dplyr

---

class: center middle with-logo logo-purrr

# purrr

---

class: center middle with-logo logo-plumber

# plumber

```{css, include=FALSE}
.with-logo::before {
	content: '';
	width: 110px;
	height: 126px;
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	background-size: contain;
	background-repeat: no-repeat;
}
.logo-dplyr::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/dplyr.png);
}
.logo-purrr::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/purrr.png);
}
.logo-plumber::before {
	background-image: url(https://github.com/rstudio/hex-stickers/raw/master/PNG/plumber.png);
}
```

[giabaio]

Thank you @gadenbuie ! Seems to be working fine. Awesome.

Only thing is you just need to add the class: xxx bit to every single slide, but other than that works perfectly. Thanks!