Search code examples
htmlcssr-markdownreveal.js

Customize title page on revealjs presentation

I am preparing a presentation using R Markdown and revealjs and I'd like to customize the title page. In particular, I wanted to:

  1. Reduce the font size of the author name.
  2. Remove bold from author name.
  3. Increase space between the title and author name.

so far, I was only able to come up with some Html hacks in the heading, which did not work satisfactorily.

--- 
title: <font size=8>My Really, Truly, Indeed Very Long Title</font>
author: </b><br><br><font size=5>My Longish Name</font>
output: revealjs::revealjs_presentation
---

I guess I'll need a custom CSS, but I don't know which parameters to change. I'm not an experienced CSS user. Also happy with any more successful Html hacks than the one above.

Solution

  • This is the best I could do, you can add inline CSS in Rmarkdown. The font-weight: normal; is suppose to remove the bold from the subheader, but I don't think it rendered properly, the line-height: 90px; is suppose to help control the padding between the headers.

    --- 
title: My Really, Truly, Indeed Very Long Title
author: My Longish Name
output: revealjs::revealjs_presentation
---

```{css}
h1.title {
  font-size: 8px;
  line-height: 90px;
}

h2.author {
  font-weight: normal;
  line-height: 90px;
}
```

    Just example of the Revealjs output that has been changed enter image description here