Search code examples
cssryamlr-markdownxaringan

Custom background image specified in yaml header

I use the same css file for multiple presentations. I would like to change the background image of the title slide for each presentation without creating a new css file every time.

Right now the path is hardcoded like this

.title-slide {
       background-image: url(path/to/image);
       background-size: cover;
    }

But I would like to specify the path to the image in the yaml header like this 

---
background_image: "path/to/image"
---

Is this possible?

Solution

  • Yes this is possible. The easiest way to do this is to disable the automatic creation of the title slide first by including seal: false and specify your own title slide using the yaml data.

    ---
title: "Modify title background image"
author: "Emi Tanaka"  
date: "07/09/2019"
output: 
  xaringan::moon_reader:
    seal: false
params: 
    background_img: "someimages.png"
---


class: title-slide center middle
background-image: url(`r params$background_img`)
background-size: cover


# `r rmarkdown::metadata$title`

## `r rmarkdown::metadata$author`

### `r rmarkdown::metadata$date`

---

Your first non-title slide content here.