R flexdashboard remove title bar

Question

I am working on a project using rMarkdown and the flexdashboard package from rStudio. Everything is coming together nicely. But I would like to remove the blue title bar you see at the top of the image here.

We are dropping this html page into a window so it becomes a second title bar, which looks terrible. Is there a function in flexdashboard to remove this entire apparatus?

Here is the YAML and the first chunk you see just below the blue bar in the photograph. Any suggestion would be greatly appreciated.

---
title: New Hampshire Statewide Age Adjusted Incedence Rates of Lyme
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
---

```{r setup, include=FALSE, message=FALSE, warning=FALSE, echo=TRUE}

```

Row
-----------------------------------------------------------------------

### 
```{r, aarState, message=FALSE, warning=FALSE}

library(flexdashboard)
library(rbokeh)
#load state-wide age adjusted rates

aar<-read.csv("stateAAR.csv")
figure(title=" Age Adjusted Rates by Year",width= 1500, height =600) %>%
  ly_segments(year, lci*100000, year, uci*100000, data=aar, color = "#b37700", width = 1) %>%
  ly_points(year, adj.rate*100000, glyph = 21, size=6, data = aar, hover= "<strong>Rate per 100,000:</strong> @rateHundThou </br> <strong>Upper Confidence:</strong> @uciHT </br><strong> Lower Confidence:</strong> @lciHT " , color="#666622" )%>%

  x_axis(label ='Year')%>%
  y_axis(label ='Age Adjusted Rate')


```  

Row

Answer 1

I am not aware of any flexdashboard option. But you could use jQuery to remove the navbar and move the body up. Just include the following snippet right after your YAML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $('.navbar').remove();
  $('body').css('padding-top', '0px');
});
</script>

I think this leaves the main navigation bar of the parent document untouched. If not it might need some lsight modification.

Answer 2

You can just add CSS styling directly to your markdown document (no JQuery required):

---
title: "Untitled"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
---
<style>

body {
  padding-top:0px
}

.navbar{
  visibility: hidden
}

</style>


```{r setup, include=FALSE}
library(flexdashboard)
```

Column {data-width=650}
-----------------------------------------------------------------------

### Chart A

```{r}
hist(iris$Sepal.Length)

```

Column {data-width=350}
-----------------------------------------------------------------------

### Chart B

```{r}
hist(iris$Sepal.Width)
```

### Chart C

```{r}
hist(iris$Petal.Length)
```

Results in: