Insert a link into the navbar in shiny - r

I have some trouble with inserting a link into a navbar with navbarPage in shiny. I can put a link but the navbar looks weird. Does anyone know how to fix it ?
To produce an app with a link in the navbar :
library(shiny)
runApp(list(
ui = navbarPage(
title="My App",
tabPanel("tab1"),
tabPanel("tab2"),
tabPanel(a(href="http://stackoverflow.com", "stackoverflow"))),
server = function(input, output) { }
))
With shiny_0.9.1
Thanks !
EDIT :
A colleague show me a workaround, it consist of puting the link we want in panel 3 into the headerof panel 2.
An app to demonstrate this and the solution from #
20050 8519 21102 26896 16937 for the link in the title's app :
runApp(list(
ui = navbarPage(
title=HTML("stackoverflow"),
tabPanel("tab1"),
tabPanel(HTML("tab2</a></li><li><a href=\"http://stackoverflow.com\">stackoverflow"))
),
server = function(input, output) { }
))

I managed to get it working on a more recent version of Shiny for the left-hand site element of the NavBar, the title, with this:
corner_element = HTML(paste0('<a href=',shQuote(paste0("https://my.page.com/",page_name,"/")), '>', 'Foo', '</a>'))
navbarPage(corner_element, id="page", collapsable=TRUE, inverse=FALSE,
# [...]
)

With shiny 1.7.0 and bslib 0.3.0, it became easier to customize the navbar:
library(shiny)
library(bslib)
ui <- page_navbar(
nav("First tab"),
nav("Second tab"),
nav_item(a(href="http://stackoverflow.com", "stackoverflow")))
)
shinyApp(ui, server = function(...){})

Related

How to Add Bootstrap 4 Tooltips in Shiny App

The following code can be used to show how I would want a tooltip to appear. If version=3 then the function in shinyBS works and produces the tooltip. However with version=4 it does not work. I don't want to use the shinyBS package as it seems it's still in dev mode and would rather just straight prefer to wrap my button with some HTML using tooltips from bootstrap directly as shown here.
I'm not having success in doing it this way and wonder if anyone can suggest a good way to get the tool top for my button just using the pure HTML?
library(shiny)
library(bslib)
library(shinyBS)
ui <- fluidPage(
navbarPage(
theme = bs_theme(bootswatch = "flatly", version = 4),
title = 'Methods',
tabPanel('One'),
),
mainPanel(
h1('Hello World'),
actionButton("button", "Some Button"),
bsTooltip("button", "Something to be said here", "top"),
)
)
server <- function(input, output) {
}
shinyApp(ui, server)

pic is not displaying in infoBox in shiny dashboard

I am not able to find the error why the pic is not getting displayed inside the infoBox, shinyApp.
library(shiny)
library(shinydashboard)
a <- 45
ui <- shinyUI(
dashboardPage(
dashboardHeader(title = "ABC"),
dashboardSidebar(),
dashboardBody(
fluidPage(
infoBox("BCD", a, div(img(src = "img.png", width = 100), style = "text-
align: center;"))
)
)
)
)
server <- function(input, output) {}
shinyApp(ui = ui, server = server)
The following worked for me:
Save the above script as app.R
In the folder of app.R, create a folder named www and save img.png in it
hit the Run App button on RStudio (top right)
You might want to have a look at the addResourcePath function for a more flexibel solution:
http://shiny.rstudio.com/reference/shiny/0.14/addResourcePath.html

Add Tooltip to navbarMenu in Shiny

I would like to add a tooltip for navbarMenu in Shiny app. Similar question asked here but, there is no answer.Here is my reproducible code
library(shiny)
library(shinyBS)
ui <- shinyUI(fluidPage(
sidebarLayout(
sidebarPanel(),
mainPanel(tabsetPanel(
navbarMenu("Tab1",bsTooltip(id="Tab1", title="Short description for the tab", trigger = "hover"),
tabPanel("Tab1.1"),
tabPanel("Tab1.2")),
tabPanel("Tab2",tabsetPanel(
tabPanel("Tab2.1"),
tabPanel("Tab2.2"))),
tabPanel("Tab3",tabsetPanel(
tabPanel("Tab3.1"),
tabPanel("Tab3.2"),
tabPanel("Tab3.3")))
)))))
server <- function(input, output) {}
shinyApp(ui = ui, server = server)
During my research I found this solution R Shiny: Use navbarPage with bsModal by shinyBS, but for bsModel.
Also, there is a procedure mentioned here which is based in java-script.I know both solutions are for tabpanel but I believe it's the same problem, which is navbarMenu and tabpanel don't have an id.
I'm statistician and I don't have background in HTML or java-script to rewrite the attribute for the tab title or navbarMenu.
I hope I phrase my question in a clear manner. Thanks in advance for your time and kind help.
you can use HTML wenn passing the Title of the Tabs. in this case I just pt the title in a span and added the attribute titlewhich is the attribute HTML uses default for mouse-overs. For me this is much sinpler the trying to add it over shinyBS.
library(shiny)
library(shinyBS)
ui <- shinyUI(fluidPage(
sidebarLayout(
sidebarPanel(),
mainPanel(tabsetPanel(
navbarMenu(span("Tab1",title="Short description for the tab" ),
tabPanel("Tab1.1"),
tabPanel("Tab1.2")),
tabPanel("Tab2",tabsetPanel(
tabPanel("Tab2.1"),
tabPanel("Tab2.2"))),
tabPanel("Tab3",tabsetPanel(
tabPanel("Tab3.1"),
tabPanel("Tab3.2"),
tabPanel("Tab3.3")))
)))))
server <- function(input, output) {}
shinyApp(ui = ui, server = server)
hope this helps!
I found another solution using javascript. Perhaps it may be more useful.
library(shiny)
shinyApp(
ui = navbarPage(
tags$script(HTML('
$( document ).on("shiny:sessioninitialized", function(event) {
$(\'span[data-toggle="tooltip"]\').tooltip({
html: true
});
});'
)),
navbarMenu(
"Menu"
,tabPanel(span("navbarTitle 1",title="XXX",`data-toggle`="tooltip"),
tabsetPanel(
tabPanel(span("Tab 1", title = "aaa",`data-toggle`="tooltip")),
tabPanel(span("Tab 2",title="bbb",`data-toggle`="tooltip")),
tabPanel(span("Tab 3",title="ccc",`data-toggle`="tooltip"))
)
)
,tabPanel( "navbarTitle 2")
)
),
server = function(input, output) {
}
)

R shiny: color fileInput button and progress bar

Is there a way to color fileInput button in R shiny? It looks like it is possible as shown here on this page on github. However I cannot find the code for this to be done.
This is the simple application that I would like to modify to have the button and progress bar colored red.
In ui.R:
library(shiny)
shinyUI(fluidPage(
titlePanel("Test"),
fileInput("Test","")
))
and server.R
library(shiny)
shinyServer(
function(input, output) {
}
)
Thanks for any advice.
You can use standard Bootstrap classes to style action buttons:
library(shiny)
shinyApp(
ui=shinyUI(bootstrapPage(
actionButton("infoButton", "Info", class="btn-info"),
actionButton("warningButton", "Warning", class="btn-warning"),
actionButton("successButton", "Success", class="btn-success"),
actionButton("dangerButton", "Danger", class="btn-danger"),
actionButton("defaultButton", "Default", class="btn-default"),
actionButton("primaryButton", "Primary", class="btn-primary")
)),
server=shinyServer(function(input, output, session){
})
)
Regarding file inputs as far as I know it is not possible without using CSS directly. Page you've linked is an opened pull-request and it doesn't look like it will be merged soon.
This answer provides a good description how to create fancy upload buttons with bootstrap. It should work just fine in Shiny as well.
CSS could be used in shiny to custom your fileInput widget !
Use the following code in order to color it in red.
NB - Any browser you're using to view the app should have developer tools that let you inspect elements and see styles applied to any element. You have to right click on the relevant element and choose inspect !
library(shiny)
ui <- fluidPage(
fileInput(inputId = "Test",label = ""),
tags$style("
.btn-file {
background-color:red;
border-color: red;
}
.progress-bar {
background-color: red;
}
")
)
server <- function(input, output) {
}
shinyApp(ui = ui, server = server)

Shiny: adding addPopover to actionLink

I want to include a small "Help" actionLink (next to a "Render" actionButton) that acts as a popover (see here). Here's my code:
server.R:
shinyUI(pageWithSidebar(
sidebarPanel(
actionButton("renderButton", "Render"),
actionLink("link", "Help") ),
mainPanel()
))
ui.R:
shinyServer(function(input, output, session) {
# ... dealing with renderButton ...
output$link <- renderUI({
addPopover(session=session, id=output$link, title="",
content="Testing.", placement = "bottom",
trigger = "click", options = NULL)
})
})
Right now, the actionLink shows up on the sidebar, but clicking on it has no effect. Any tips? I think it may have to do with the id in addPopover, but I haven't found many examples to provide a framework. I found this, but I want to deal with the popover in server.R, not ui.R. Can it be done this way, or should I just make the popover in ui.R?
From ?Tooltips_and_Popovers:
There must be at least one shinyBS component in the UI of your app in
order for the necessary dependencies to be loaded. Because of this,
addTooltip and addPopover will not work if they are the only shinyBS
components in your app.
To get the pop over to work, you can change your actionButton into a bsButton, and modify server.R to only contain the call to addPopover. The id argument to addPopover also needs to be changed to refer to the id of the ui object you want the pop over to appear on, in your case "link", the id of the actionLink .
Here's the modified example code in a self-contained code chunk:
library(shiny)
library(shinyBS)
runApp(
# Ui
list(ui = pageWithSidebar(
headerPanel("Test App"),
sidebarPanel(
bsButton("renderButton", "Render"),
actionLink("link", "Help") ),
mainPanel("Hello World!")
),
# Server
server = function(input, output, session) {
# ... dealing with renderButton ...
addPopover(session=session, id="link", title="",
content="Testing.", placement = "bottom",
trigger = "click", options = NULL)
})
)

Resources