External .css file - Where can I place ?

shiny
#1

Hello...
I'd like to know where can I put my .css file and how can I call it. I'm trying like this, with no success:
(in ui.R) :

fluidPage(
  tags$link(rel = "stylesheet", type="text/css", href="www/styles.css"),
  h1("This is my app title!", align = "center")
)

With www folder in the same level as ui.R file.

#2

Hello @Ninja2112. I have found success keeping the .css file in the same level as the ui.R file and doing the following:

fluidPage(
  theme = "style.css",
  h1("This is my app title!", align = "center")
)
#3

Thanks, man, but still doesn´t work.

#4

My apologies. The style.css file is actually in the www folder for the example I provided, not at the ui.R level. However, no reference to "www/" is needed in theme =. Does that work for you?

#5

Still doesn't work. It is a global reference, ok ?
I'm using
shinyUI(fluidPage
sidebarLayout
sidebarPanel
mainPanel
Could it be due to the hierarchy ? The file is in the same level as ui.

#6

Did you try moving it back to the www folder?

#7

Yes...by putting www folder in the same level as .css file

#8

the css file should be within a www folder, which itself should be within your app folder

#9

Whether the default resource publishing via the www folder is done or not, depends on how your app is launched. Please see this related question.

#10

Below is a look at an example app (app.R), CSS file (styles.css), folder structure, and the resulting app. If you have separate server.R, ui.R, and/or global.R files, they would be at the app.R level.

app.R

library(shiny)

ui <- fluidPage(
  theme = 'styles.css',
  sidebarLayout(
    sidebarPanel(
      h2('This is my sidebar')
    ),
    mainPanel(
      h1("This is my app title!", align = "center")
    ) 
  )
)

server <- function(input, output) {}
  
shinyApp(ui, server)

styles.css

h1 {color: red;}

folder structure

 - my_app_folder
 | - app.R
 | - www
   | - styles.css

Here is a view of the resulting app, which applies the CSS styling.

image
image994×156 5.71 KB

#11

It worked when I put:
tags$head(
tags$link(rel = "stylesheet", type = "text/css", href = "styles.css")
)
Thank you, guys...