How to place an image above the header using shinydashboard

user_14428510 0
Viewed 45

I want to put an image on top of the header of my shiny app using shinydashboard just like shown below but I don't know how to approach this issue.

Example

Here is the basic dashboard structure:

library(shiny)
library(shinydashboard)

ui <-  dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody()
)

server <- function(input, output, session) {}

shinyApp(ui, server)
shinydashboard shiny header r image
1 Answers

We can simply wrap the dashboardPage in a body tag and include the image:

library(shiny)
library(shinydashboard)

ui <- tags$body(
  tags$img(src = "https://i.stack.imgur.com/IqerJ.png", width = '100%'),
  dashboardPage(
    dashboardHeader(),
    dashboardSidebar(),
    dashboardBody()
  )
)

server <- function(input, output, session) {}

shinyApp(ui, server)

result

Relevant info: https://github.com/rstudio/shiny/pull/660

Here is another way to realize this: https://jonkatz2.github.io/2018/06/22/Image-In-Shinydashboard-Header

PS: you might want to save that image in your local www folder instead of using imgur.com as the src.

user_98413890
Related