Skip to content

Commit

Permalink
Fixed iframes HTML
Browse files Browse the repository at this point in the history
  • Loading branch information
@Gammerdinger
Gammerdinger authored Sep 4, 2024
1 parent 062cf1d commit c3ba1f2
Showing 1 changed file with 13 additions and 12 deletions.
25 changes: 13 additions & 12 deletions RShiny/lessons/04_layouts.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,8 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Sidepanel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Sidepanel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>


# Adding a title

Expand Down Expand Up @@ -113,7 +114,7 @@ shinyApp(ui = ui, server = server)

This app would now look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Title_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Title_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

# Creating columns

Expand Down Expand Up @@ -163,7 +164,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

## Nesting columns

Expand Down Expand Up @@ -230,7 +231,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_nested_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_nested_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

## Multiple Rows

Expand Down Expand Up @@ -293,7 +294,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_multiple_rows_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_multiple_rows_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

## Thematic Breaks

Expand Down Expand Up @@ -342,7 +343,7 @@ shinyApp(ui = ui, server = server)

This app would now look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_multiple_rows_with_break_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Fluid_row_multiple_rows_with_break_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

# Navbar

Expand Down Expand Up @@ -387,9 +388,9 @@ server <- function(input, output) {
shinyApp(ui = ui, server = server)
```

This app would looke like:
This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Navbar_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Navbar_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

Within the `navbarPage()` function there is a `position` argument, with three options:

Expand Down Expand Up @@ -455,7 +456,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Navbar_menu_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Navbar_menu_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

## Navigation List

Expand Down Expand Up @@ -511,7 +512,7 @@ shinyApp(ui = ui, server = server)

This would create an app that looks like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Nav_list_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Nav_list_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

> Note that the `navbarMenu()` function also works within `navlistPanel()` just like it works within `navbarPage()`.
Expand Down Expand Up @@ -571,7 +572,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Tabset_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Tabset_panel_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

> Note: `navbarPage()` can also be embedded within `mainPanel()`. However, traditionally you will see `navbarPage()` be used to as the banner at the top of the app while `tabsetPanel()` will be used as different tabs within a single tab of `navbarPage()`.
Expand Down Expand Up @@ -625,7 +626,7 @@ shinyApp(ui = ui, server = server)

This app would look like:

<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Shiny_themes_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe>
<p align="center"><iframe src="https://hcbc.connect.hms.harvard.edu/Shiny_themes_demo/?showcase=0" width="300" height="175px" data-external="1"></iframe></p>

If you wanted to see how various themes might look on your specific app, instead of in the gallery provided by `shinythemes`, then you can apply them from a selection menu by adding this code to your app:

Expand Down

0 comments on commit c3ba1f2

Please sign in to comment.