Adding images in the title and at the right of navbarPage

[bretauv]

I would like to include a small image at the left of the title of my navbarPage, and to include another image completely at the right of this same navbarPage. I found this answer which provides the same layout than the one I would like to have. The problem is that this solution does not provide a fully reproducible example and I can't figure out how to include the chunks of code in the ui part.

Does anybody know how to make a reproducible example from this answer?

[nirgrahamuk]

Hi, I would ask you to consider providing a reprex containing minimal code that shows your app appearance , in its current less than desired state, then it will be easier for others to suggest changes to it, than to begin from scratch and re-do work that you have already done

[bretauv]

@nirgrahamuk Sure, here is what I tried to do but it is not very different from the answer linked in the first post since I don't really know how to use HTML:

library(shiny)

ui <- navbarPage(
  tags$script(HTML("var header = $('.navbar > .container-fluid');
 header.append('<div style=\"float:right\"><h3>This is R</h3></div>');"
  )),
  tags$script(HTML("var header = $('.navbar > .container-fluid');
header.append('<div style=\"float:right\"><ahref=\"URL\"><img src=\"image.png\" alt=\"alt\" style=\"float:right;width:33px;height:41px;padding-top:10px;\"> </a>`</div>');
    console.log(header)")
  ),

  title = div(img(src="image.png", height = '40px', width = '40px'), "something"),
  tabPanel("foo")
)
server <- function(input, output, session) {
  
}

shinyApp(ui, server)

This is the image called image.png. I put it in the www folder, which is placed in my app directory.

There are mainly two things to solve:

• some text is displayed on the below the navbar whereas it shouldn't be displayed at all
• the image and the text at the left are not centered

Also asked on SO