Author: David Granjon
Date: 2025-08-25

# CSS preloaders

#### David Granjon

#### 2025-08-25

## How to set up a preloader?

Pass the argument `preloader` to the `dashboardPage()` function. It expects a nested list containing all parameters necessary to `waiter::waiterShowOnLoad`. Please have a look to the `{waiter}` documentation for more details.

That’s all!

Code

    library(shiny)
    library(shinydashboard)
    library(shinydashboardPlus)
    library(waiter)
    shinyApp(
      ui = dashboardPage(
        preloader = list(html = tagList(spin_1(), "Loading ..."), color = "#3c8dbc"),
        header = dashboardHeader(),
        sidebar = dashboardSidebar(),
        body = dashboardBody(
          actionButton("reload", "Reload")
        ),
        title = "Preloader"
      ),
      server = function(input, output, session) {
        # fake reload
        observeEvent(input$reload, {
          session$reload()
        })
      }
    )