Make sidebar resizeable

[royfrancis]

How to make the sidebar width be adjustable by the user?

I have this dummy app to play with.

Click for full code

library(shiny)
library(bslib)

ui <- page_sidebar(
  title = "Histogram demo",
  sidebar = sidebar(
    sliderInput(
      "n",
      "Number of observations",
      min = 10,
      max = 1000,
      value = 100,
      step = 10
    )
  ),
  fillable = TRUE,
  plotOutput("hist")
)

server <- function(input, output, session) {
  output$hist <- renderPlot({
    hist(
      rnorm(input$n),
      col = "#1f76b4",
      border = "white",
      main = NULL,
      xlab = "Value"
    )
  })
}

shinyApp(ui, server)

I have added one line of css which looks like it could work.

.sidebar { 
  resize: horizontal; 
}

Click for full code

library(shiny)
library(bslib)

ui <- page_sidebar(
  title = "Histogram demo",
  tags$style(".sidebar { resize: horizontal; }"),
  sidebar = sidebar(
    sliderInput(
      "n",
      "Number of observations",
      min = 10,
      max = 1000,
      value = 100,
      step = 10
    )
  ),
  fillable = TRUE,
  plotOutput("hist")
)

server <- function(input, output, session) {
  output$hist <- renderPlot({
    hist(
      rnorm(input$n),
      col = "#1f76b4",
      border = "white",
      main = NULL,
      xlab = "Value"
    )
  })
}

shinyApp(ui, server)

But not really. The sidebar is technically resizeable, but the content on the right doesn't resize and the collapse button is fixed as well.

resize.mov

What is the best way to do this? Personally, I think the ability to adjust the sidebar width by the user should be the default. This should give the user more flexibility.

Session

─ Session info ──────────────────────────────────────────────────────────────────────────────────────────────────
 setting  value
 version  R version 4.5.2 (2025-10-31)
 os       macOS Tahoe 26.1
 system   aarch64, darwin20.0.0
 ui       unknown
 language (EN)
 collate  en_GB.UTF-8
 ctype    en_GB.UTF-8

─ Packages ──────────────────────────────────────────────────────────────────────────────────────────────────────
 package     * version date (UTC) lib source
 bslib       * 0.9.0   2025-01-30 [1] CRAN (R 4.5.1)
 cachem        1.1.0   2024-05-16 [1] CRAN (R 4.5.1)
 cli           3.6.5   2025-04-23 [1] CRAN (R 4.5.1)
 devtools      2.4.6   2025-10-03 [1] CRAN (R 4.5.1)
 digest        0.6.38  2025-11-12 [1] CRAN (R 4.5.2)
 ellipsis      0.3.2   2021-04-29 [1] CRAN (R 4.5.1)
 fastmap       1.2.0   2024-05-15 [1] CRAN (R 4.5.1)
 fs            1.6.6   2025-04-12 [1] CRAN (R 4.5.1)
 glue          1.8.0   2024-09-30 [1] CRAN (R 4.5.1)
 htmltools     0.5.8.1 2024-04-04 [1] CRAN (R 4.5.1)
 jquerylib     0.1.4   2021-04-26 [1] CRAN (R 4.5.1)
 jsonlite      2.0.0   2025-03-27 [1] CRAN (R 4.5.1)
 lifecycle     1.0.4   2023-11-07 [1] CRAN (R 4.5.1)
 magrittr      2.0.4   2025-09-12 [1] CRAN (R 4.5.1)
 memoise       2.0.1   2021-11-26 [1] CRAN (R 4.5.1)
 pkgbuild      1.4.8   2025-05-26 [1] CRAN (R 4.5.1)
 pkgload       1.4.1   2025-09-23 [1] CRAN (R 4.5.1)
 purrr         1.2.0   2025-11-04 [1] CRAN (R 4.5.2)
 R6            2.6.1   2025-02-15 [1] CRAN (R 4.5.1)
 remotes       2.5.0   2024-03-17 [1] CRAN (R 4.5.1)
 rlang         1.1.6   2025-04-11 [1] CRAN (R 4.5.1)
 sass          0.4.10  2025-04-11 [1] CRAN (R 4.5.1)
 sessioninfo   1.2.3   2025-02-05 [1] CRAN (R 4.5.1)
 usethis       3.2.1   2025-09-06 [1] CRAN (R 4.5.1)
 vctrs         0.6.5   2023-12-01 [1] CRAN (R 4.5.1)

[gadenbuie]

Good news! I implemented this feature earlier this year and it'll be in the next bslib release. Try using bslib from GitHub and sidebars are all resizable by default. (#1217)