CODEWITHSUNDEEP
rshiny
Basballguy
Basballguy

Reputation: 61

Using Shiny without shiny.css

I like Shiny and all it has to offer, however i do NOT like shiny.css. It seems no matter how i build my app, it includes the shiny.css and it collides with other CSS styling I have declared in the head.

I've tried several things. Referencing a them in fluidPage doesn't seem to omit it.

Declaring CSS links in the header doesn't ignore it.

ui <- fluidPage(theme="bootstrap.css")

OR

tags$link(type="text/CSS", href="bootstrap.css", rel="stylesheet"),

and that's with putting the bootstrap.css (and others) in the www directory

every time i launch a shiny app, i get this by default for using shiny:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="application/shiny-singletons"></script>
<script type="application/html- dependencies">json2[2014.02.04];jquery[1.12.4];shiny[1.1.0]</script>
<script src="shared/json2-min.js"></script>
<script src="shared/jquery.min.js"></script>
<link href="shared/shiny.css" rel="stylesheet" />
<script src="shared/shiny.min.js"></script>

I can live with everything else, i just do not want shiny.css included.

My actual results will not have the tag with shiny.css in it.

Upvotes: 3

Views: 644

Answers (1)

Yanir Mor
Yanir Mor

Reputation: 711

Consider using an HTML template for the UI, using the htmlTemplate() function.
That way you can control exactly which CSS/JS scripts are included and which aren't.
See full article here: https://shiny.rstudio.com/articles/templates.html

Here is a working example that doesn't include shiny.css:

library(shiny)

shinyApp(
  ui = htmlTemplate(
    text_ = '
      <html>
        <head> 
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <script type="application/shiny-singletons"></script>
            <script type="application/html-dependencies">json2[2014.02.04];jquery[1.12.4];shiny[1.2.0]</script>
            <script src="shared/json2-min.js"></script>
            <script src="shared/jquery.min.js"></script>
            <script src="shared/shiny.min.js"></script>
        </head>
        <body>
          {{btn}} 
          {{txt}} 
        </body>
      </html>',
    btn = actionButton('a','a'),
    txt = textInput('b', 'b', 'b')
  ),

  server = function(input, output, session) {
    observeEvent(input$a, updateTextInput(session, 'b', 'B', 'B'))
  }
)

Upvotes: 4

Related Questions