Search code examples
rshinyshinydashboard

How to make an infomation button in shiny dashboard


I would like to show a information button in my shiny app, where user can click and an text (information) box pop out with some text there. This is for users to click on the button to get some general description about some part of my shiny app.

For some reason, I could not find it in shiny or shinydashboard for that purpose. Does anyone know how I can make the button? Thanks.


Solution

  • Here are 2 possibilities using 'dropMenu()' from the shinyWidgets package and a modal dialogue as suggested in the comments. In this example a button is placed in the dashboard header that opens an information panel or an action button in the dashboard body can be clicked to bring up a separate window.

    Placing a button in the dashboard header will allow it to persist regardless of the tab that is activated. This might be helpful if the menu needs to always be accessed.

    library(shiny)
    library(shinydashboard)
    library(shinyWidgets)
    
    ui <- dashboardPage(
      dashboardHeader( title = "app",
                       tags$li(class = "dropdown",
                               dropMenu(
                                 dropdownButton("Info", status = 'success', icon = icon('info')),
                                 h3(strong('Information')),
                                 br(),
                                 h5('This is really helpful'),
                                 textInput('text', 'You can also put UI elements here'),
                                 placement = "bottom",
                                 arrow = TRUE)
    
                       )
    
      )
      ,
      dashboardSidebar(),
      dashboardBody(actionButton('help', 'Help'))
    )
    
    server <- function(input, output) { 
    
      observeEvent(input$help,{
        showModal(modalDialog(
          title = "Help!",
          "Information",
          textInput('text2', 'You can also put UI elements here')
        ))
      })
      }
    
    shinyApp(ui, server)
    

    enter image description here enter image description here