Search code examples
rshinypng

Static image (png) in R Shiny navbarPage

I'm struggling to display a logo (logo.png) in the navbarPage of an R Shiny app. I followed the advice/instructions I found in the internet (for example here, here, here or here and even here) and in principle, it seems to work. At least the title appears and the padding is respected. However, only a placeholder is shown instead of the actual png and if you view the image it says "Not Found":

enter image description here

The structure of the app is as follows:

global.R
ui.R
server.R
www/img/logo.png

The code (located in ui.R):

shinyUI(
  navbarPage(
    title = div(img(src = "logo.png",
                    filetype = "image/png",
                    style = "margin-top: -14px;
                            padding-right: 20px;
                            padding-bottom: 10px"),
                "Title",
    tabPanel("Some",
             ...),
    ...
    )
)

I have the suspicion that the issue is somehow related to the structure of the Shiny app (I also tried with the full path of the logo www/img/logo.png without success), but I fail to figure out where.

Would be great if anyone could give me some advice or hint. Thank you :)

Solution

  • By defaults, Shiny uses www as root for internet resources. So, if you have an image stored in working_path/www/img/img.png, the right path will be img/img.png.

    If you want to specify other paths, use addResourcePath()

    e.g. If you want to show an image under my_path/img/img.png you want first add the path

    addResourcePath("new_root", "my_path")

    Then refer it in Shiny as

    img(src = "new_root/img/img.png")