5

I would like to know how can I adjust the height of dashboardheader in shinydashboard

dashboardHeader(
    title = loadingLogo('http://company.fr/','logo.jpg','buffpowa.gif'),
    titleWidth = 600
)

I can modify the width but the logo is too large for the header. I want the header to have enough height to display the full logo.

Thanks

thothal
  • 16,690
  • 3
  • 36
  • 71
Valentin LEFRANC
  • 51
  • 1
  • 3

1 Answers1

9

You need to set the height of the following elements:.main-header and .main-header .logo. Also please note that it only works if they are set inside tags$li within the dropdown class.

Code

library(shiny)
library(shinydashboard)

ui <- dashboardPage(
  dashboardHeader(
    # Set height of dashboardHeader
    tags$li(class = "dropdown",
      tags$style(".main-header {max-height: 200px}"),
      tags$style(".main-header .logo {height: 200px}")
    ),
    # Use image in title
    title = tags$a(href='http://company.fr/',
                   tags$img(src='logo.jpg'))
  ),
  dashboardSidebar(
    # Adjust the sidebar
    tags$style(".left-side, .main-sidebar {padding-top: 200px}")
  ),
  dashboardBody()
)

server <- function(input, output){}

shinyApp(ui, server)

Example

Using a 200x200 px android logo: Example

ismirsehregal
  • 30,045
  • 5
  • 31
  • 78
GyD
  • 3,902
  • 2
  • 18
  • 28
  • 1
    This solution works for expanding the title and header of the dashboard but if one wants to reduce the size of the header, this solution doesn't work (only the title section will be reduced). A new [question](http://stackoverflow.com/questions/41504337/adjust-height-of-the-whole-header-bar-in-dashboardheader-in-shiny-dashboard) asking if this is possible has been posted. Thanks – HBeel Jan 09 '17 at 12:17