Scroll Back to Top Icon in Shiny and R Markdown

Add a scroll back to top 'Font Awesome' icon < https://fontawesome.com/> in 'rmarkdown' documents and 'shiny' apps thanks to 'jQuery GoTop' < https://scottdorman.blog/jquery-gotop/>.

gotop

Add a scroll back to top in R Markdown and Shiny

See live demo{.btn .btn-primary .btn role="button"}

Install

Install the released version from CRAN.

install.packages("gotop")

To get a bug fix, or use a feature from the development version, you can install it from GitHub.

# install.packages("remotes")
remotes::install_github("lgnbhl/gotop")

RMarkdown

To add a scroll up icon in a R Markdown document, simply add use_gotop() inside a R code chunk with {r, echo = FALSE} so the code will not be shown in the final document.

gotop::use_gotop()

Shiny

To use it in Shiny, call use_gotop() inside the UI.

library(shiny)
library(gotop)

shinyApp(
  ui = fluidPage(
    align = "center",
    use_gotop(use_cdn = FALSE), # add it inside the ui
    h2("Shiny with gotop"), 
    HTML(rep("&darr;<br/><br/>scroll down<br/><br/>", 20)),
    textOutput("lookright")
  ),
  server = function(input, output, session){
    output$lookright <- renderText({ print("Look right") })
  }
)

Customize it

You can replace the default Font Awesome chevron up icon (“fas fa-chevron-up”) by any other Font Awesome icon, change its color, width and much more (run ?use_gotop() to see the documentation).

gotop::use_gotop(
  src = "fas fa-chevron-circle-up", # css class from Font Awesome
  color = "tomato", # color
  opacity = 0.8, # transparency
  width = 30, # size
  appear = 100 # number of pixels before appearance
  )