htmlcssrshinyshinydashboard

Shinydashboard, align logo to the right

Is it possible to move the logo in the header completely to the right side? I have attached a picture how I would like it to look like.

enter image description here

Here is a MWE:

library(shiny)
library(shinydashboard)

ui <- function(){

dashboardPage(
    dashboardHeader(title = tags$a(href = 'https://google.com',
                                           tags$img(src = 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png', height= 50,width= 50, align = "right"),
                                           'Title')),
  dashboardSidebar( sidebarMenu(id="side", menuItem("Option1", tabName="op1"),

                                menuItem("Option2", tabName="op2"))
),


  body=dashboardBody())}


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

shinyApp(ui, server)
Solution

  • You could wrap it in a li wrapper of class dropdown. Try this

    library(shiny)
library(shinydashboard)

ui <- function(){
  
  dashboardPage(
    dashboardHeader(
      title = "Demo",
      tags$li(class = "dropdown",
              tags$a(href = 'https://google.com',
                     tags$img(src = 'https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png', height= 50,width= 50, align = "right")
              )
      ),
      dropdownMenuOutput('messageMenu')
    ),
    dashboardSidebar( sidebarMenu(id="side", menuItem("Option1", tabName="op1"),
                                  
                                  menuItem("Option2", tabName="op2"))
    ),
    
    
    body=dashboardBody())}


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

shinyApp(ui, server)