Clickable Table of Contents in R Shiny – shiny

In pure HTML you would assign anchor names, and then you can write ancor href’s to make clickable links to them.

I use that concept to extend your example.

library(shiny)

linebreaks<-function(x){
  tagList(map(1:x,~br()))
}

ui <- fluidPage(sidebarLayout(
  sidebarPanel = sidebarPanel(
    h4("Contents"),
    a(href="#protag", "Protagonists")
  ),mainPanel = 
  mainPanel(
    tabsetPanel(
      tabPanel("Story",
               
               fluidRow(column(width=2),
                        column(
                          h3(p(tags$em("Introduction"),style="color:black;text-align:left; font-family: Georgia; font-size: 20px")),
                          width=6,offset=1,style="background-color:white;border-radius: 10px")),
               linebreaks(10),
               fluidRow(column(width=2),
                        column(
                          h4(p("This is a short story about nature")),
                          width=6,offset=1,
                          style="background-color:white;border-radius: 10px")),
               linebreaks(10),
               fluidRow(column(width=2),
                        column(
                          h3(p(tags$em("Chapter I"),style="color:black;text-align:left; font-family: Georgia; font-size: 20px")),
                          width=6,offset=1,style="background-color:white;border-radius: 10px")),
               
               linebreaks(10),
               fluidRow(column(width=2),
                        column(
                          h4(p("In this chapter we present the background of the story")),
                          width=6,offset=1,
                          style="background-color:white;border-radius: 10px")),
               linebreaks(10),
               fluidRow(column(width=2),
                        column(
                          h3(p(tags$em("Chapter II"),style="color:black;text-align:left; font-family: Georgia; font-size: 20px")),
                          width=6,offset=1,style="background-color:white;border-radius: 10px")),
               linebreaks(10),
               fluidRow(column(width=2),
                        column(
                          a( name = "protag"),
                          h4(p("This chapter is about the main protagonists")),
                          width=6,offset=1,
                          style="background-color:white;border-radius: 10px"))),
    )
  )
))

server <- function(input, output, session) {
  
}

shinyApp(ui, server)

probably you want to use shinydashboard or one of its variants to have independently scrollable sidebar from main panel to have this approach make more sense.

Read more here: Source link