How can I add my logo to the slides header lines using `xaringan`?

[Sinval]

I am using xaringan and I want to use the logo in all slides (except) the first and the inverted ones. I want to place the logo on the header line (heading level 1) however, using the css options (i.e. background-position ) I 'm only able to put it immediately below the header line.

[jdb]

If you're willing to add another dependency, take a look at the xaringanExtra package https://github.com/gadenbuie/xaringanExtra#-logo

You're able to see what it would look like here https://pkg.garrickadenbuie.com/xaringanExtra/logo/#1

The use_logo function from the package would add the logo to every slide, but you can probably use CSS and set the first and inverted slides to display: none. Maybe @grrrck already has thought of that within the package.

[Sinval]

It worked! Thank you! However, it seems that the argument image_url only captures files on the web, if I use the URL of my file in my server with the https://... it captures the png successfully. If I use the specific path address in the system it does not capture it... I tried with here() and with the exact /home/...

[grrrck]

Hi @Sinval, I'm glad that xaringanExtra worked for you! In general, to use images in xaringan, it's best to place them in the same folder as your slides. Your R code inside your .Rmd can use any file on your system, but once you've rendered your slides to the .html file, the files used in your rendered slides need to be in the same folder as that .html file. After all, xaringan slides are web pages!

As @jdb mentioned, the logo is added to every slide by default, except for slides with the classes listed in the exclude_class argument. The default value for that argument is c("title-slide", "inverse", "hide_logo") so that the logo isn't added to the title or class: inverse style slides. The third class is added so that you can use class: hide_logo on any slide where you don't want the logo to appear.

[Sinval]

Thank you for your answer. I am in love with this package and all the interesting features that it adds to our presentations in the stats classes.
I have the *.png logo file inside the same folder under which my html file is generated. I tried with paste0 together with here, and it did not work. Any possible alternative?

[grrrck]

Thanks @Sinval, I'm glad you like xaringanExtra! Sorry for the delay in getting back to you... The answer is first to place the image file in the same folder as your slides, or in a subdirectory of the folder containing your slides. The second step is to use a relative path to specify the location of the image instead of a full path. here::here() always returns a full path, so this is one place here() isn't a good idea.

Here's what your directory might look like.

slides/
|- my-awesome-presentation.Rmd
|- my-awesome-presentation.html
|- fancy-figure.png

Inside your slides, reference fancy-figure.png like this:

![](fancy-figure.png)

Or with use_logo()

```{r use-logo, echo=FALSE}
xaringanExtra::use_logo("fancy-figure.png")
```

[Sinval]

Thank you for your answer.

I did exactly what you did, the png file is in the same directory of the slides' Rmd and HTML, and I used the following code:

xaringanExtra::use_logo("logo.png", width = "40px")

It did not work, however, if I use the png file HTTP address in my server, it works... This is weird, don't you think?

[grrrck]

Oh yeah, that doesn't work! Turns out it's a "bug" (also known as a feature of CSS). I opened an issue and can probably fix this soon in xaringanExtra: https://github.com/gadenbuie/xaringanExtra/issues/23

[Sinval]

Thank you! I tried several times...

[grrrck]

Okay, this should be fixed now and relative image paths should work for xaringanExtra::use_logo() in the same way they do in the rest of your slides .Rmd. Please update xaringanExtra and if the solution doesn't work, feel free to let me know so I can follow up.

[Sinval]

It worked! Thank you very!