Inserting image on the far-right side navbarPage shiny

Question

I have the following code for a shiny app generating a navbarPage

library(shiny)
library(shinythemes)

ui <- navbarPage(
  title = "Report", theme = shinytheme("cerulean"),
  tabPanel("About"),
  tabPanel(
    "Plots",
    fluidPage(
      tabsetPanel(
        type = "pills",
        tabPanel("A"),
        tabPanel(
          "B",
          sidebarLayout(
            sidebarPanel(h4("Checkbox"),
              checkboxInput("total", label = "total"),
              uiOutput("conditionalInput"),
              width = 3
            ),
            mainPanel(
              tabsetPanel(
                tabPanel("a"),
                tabPanel("b"),
                tabPanel("c"),
                tabPanel("d"),
                tabPanel("e")
              )
            )
          )
        )
      )
    )
  )
)



server <- function(input, output) {
  output$conditionalInput <- renderUI({
    if (input$total == FALSE) {
      checkboxGroupInput("verticais",
        label = "",
        choices = list(
          "1.1" = 1,
          "1.2" = 2,
          "1.3" = 3,
          "1.4" = 4,
          "1.5" = 5,
          "1.6" = 6,
          "1.7" = 7,
          "1.8" = 8
        ),
        selected = c(1:8), inline = FALSE
      )
    }
  })
}

# Run the application
shinyApp(ui = ui, server = server)

Which produces this output

However, for layout purposes, I want to put a logo on the far right side of the window (near where the publish button is). I tried what is described in this question with no success.

Therefore, I want to know if there is another workaround to solve my problem.

Note that I have the image files on the correct www folder

Could you be more clearer? I sincerely do not know what is lacking so you (or anyone else) can help me resolve my issue. — luizgg, Feb 08 '17 at 20:16
Please include at least a code that runs (without `...`) with what you have tried — HubertL, Feb 08 '17 at 20:47
The css answer [here](http://stackoverflow.com/questions/21996887/embedding-image-in-shiny-app) may help. I don't see how else you can do it without css — Jean, Feb 09 '17 at 08:32
@waterling couldn't get that to work, but I'll keep trying. I also edited the question to contain a reproducible example. — luizgg, Feb 09 '17 at 13:26
I got a workaround by changing the `navbarPage` piece of code to `navbarPage(title = div("Report", img(src = "myimage.png", height = "10px", style = "position: relative; top: -3px; right: -1000px;")), theme = shinytheme("cerulean")` It is still not the best since the image does not attach to the navbar and also creates an unnecessary empty space between the title and the tabsets. — luizgg, Feb 09 '17 at 17:09

score 7 · Accepted Answer · edited Nov 03 '21 at 17:32

I got a workaround by changing the navbarPage piece of code to:

navbarPage(title = div("Report",
                       img(src = "myimage.png",
                           height = "10px",
                           style = "position: relative;
                                    top: -3px;
                                    right: -1000px;")),
           theme = shinytheme("cerulean")

It is still not the best since the image does not attach to the navbar and also creates an unnecessary empty space between the title and the tabsets.

Inserting image on the far-right side navbarPage shiny

1 Answers1