Menu
I'm making my first shiny application and am having trouble linking an external .css file. I've seen a few tutorials and references where people have explained how to do it and even showed example code, but I haven't had any luck. Most of the example I've seen it working use the shinyUI or fluidPage functions, like this using theme:
shinyUI(fluidPage(theme = "bootstrap.css",
headerPanel("New Application"),
sidebarPanel(
sliderInput("obs", "Number of observations:",
min = 1, max = 1000, value = 500)
),
mainPanel(plotOutput("distPlot"))
)
)
or this using tags$link:
shinyUI(fluidPage(
tags$head(
tags$link(rel = "stylesheet", type = "text/css", href = "bootstrap.css")
),
headerPanel("New Application")
)
)
or using includeCSS
I'm using fluidPage alone without shinyUI but none of the options works. I've confirmed that my working directory and app-Directory are where I think they should be, and contains the "www" subdirectory which holds the .css file. The only thing that works is if I add a tags$style and a HTML inside of my tags$head like this:
fluidPage(
tags$head(
tags$style(
HTML(
"h1 {color:purple;}
.blue-item {color:blue;}
#dark {color:navy;}"
)
)
)
)
but it doesn't solve the problem, since I don't link a CSS stylesheet with this command and therefore I don't change the appearance of my app.
886
br. Creates a line break. You can use the helper function br . tags$div( "Some text followed by a break", tags$br(), "Some text following a break" ) ## <div> ## Some text followed by a break ## <br/> ## Some text following a break ## </div>
Along with Shiny elements, you can use HTML elements to stylize your content in your application. In my opinion, R Shiny is very easy to learn despite how powerful the tool is. If you're working on a side project or looking to add something to your portfolio, I highly recommend trying it out.
To get CSS into your Shiny App, you
Add style sheets with the www directory
Add CSS to your HTML header
Add styling directly to HTML tags
Link to a stylesheet file
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="bootstrap.css"/>
</head>
<body>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
