xaringan 🤺

• "The xaringan package is an R Markdown extension based on the JavaScript library remark.js to generate HTML5 presentations of a different style."

Basics of xaringan

• to add a new slide: ---

• for increment slide: --

• two columns: .pull-left[] & .pull-right[]

• class: center, inverse, hide-count, hide-logo

• text size:

  • # heading
  • ## sub-heading
  • ### sub-sub-heading

Download xE from GitHub

install.packages("devtools")
devtools::install_github("gadenbuie/xaringanExtra")Copy Code

Required packages are:

library(xaringan)
library(xaringanExtra)
library(palmerpenguins) # to get penguins data
library(kableExtra) # to prepare tables
library(metathis) # to prepare social cardCopy Code

🤩 xE can help you to:

Slide overview

xaringanExtra::use_tile_view()Copy Code

Tachyons

• a collection of CSS utility classes (check this website http://tachyons.io/ for a list of functions)

• color of the text .nameofthecolor[your text]

  • .silver[I am red!] = I am silver.
  • .gold[I am red!] = Your are gold.

• italicize text .i[write text here]

  • .i[Allow me to tilt a bit] = Allow me to tilt a bit

• bold text .b[Bold & Beautiful.] = Bold & Beautiful.

• underline text .underline[This is important.] = This is important

• strike text .strike[This was by mistake.] = This was by mistake.

Combine tachyons

• This is just fantastic. = .b.underline.blue[This is just fantastic.]

• .b.blue[this is .red[awesome] .strike[but fake]] = this is awesome but fake

• Text size

  • .f1[hello] = hello
  • .f2[hello] = hello
  • .f3[hello] = hello
  • .f4[hello] = hello
  • .f5[hello] = hello

• Capital Text .ttc[nice thing to say] = nice thing to say

• UPPER-CASE TEXT .ttu[we all are tall] = we all are tall

Combine tachyons

.bg-washed-yellow.b--dark-blue.ba.bw2.br3.shadow-5.ph4.mt5[ The only way to write good code is to write tons of bad code first. Feeling shame about bad code stops you from getting to good code .tr[ — Hadley Wickham ]]

Clipboard

xaringanExtra::use_clipboard(
  #button_text = "Copy code from here",
  #success_text = "Done",
)Copy Code

Progress bar

xaringanExtra::use_progress_bar(color = "#800080", 
                                location = "top",
                                height = "0.25em")Copy Code

Panelset

xaringanExtra::use_panelset()Copy Code

penguins %>% 
  ggplot(aes(bill_length_mm, bill_depth_mm)) +
  geom_point(aes(color = species)) +
  scale_color_brewer(palette = "Dark2") +
  theme_bw() +
  labs(
    title = "Relationship between bill length and depth of the palmer penguins",
    x = "Bill length (mm)",
    y = "Bill depth (mm)"
      ) +
  theme(text = element_text(size = 12))Copy Code

Logo

• add logo to each slide

xaringanExtra::use_logo(
image_url = "https://pbs.twimg.com/profile_images/1399612666847674369/O6F5fplU_400x400.jpg",
link_url = "https://twitter.com/RLadiesUrmia?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor",
width = "70px",
height = "70px"))Copy Code

Highlight code

• #<< to highlight the code

xaringanExtra::use_extra_styles(
  hover_code_line = TRUE,
  mute_unhighlighted_code = TRUE
)Copy Code

Share again

• To share your xaringan slides

xaringanExtra::use_share_again()Copy Code

Social card

```r
meta() %>%
  meta_general(
    description = "Ajay Koli - Nalanda Academy",
    generator = "xaringan and remark.js"
  ) %>% 
  meta_name("github-repo" = "koliajaykr/xarExtra-session") %>% 
  meta_social(
    title = "extraordinary slides using xaringanExtra",
    url = "https://xeurmia.netlify.app/",
    image = "https://xeurmia.netlify.app/images/social-card.png",
    og_type = "talk",
    og_author = "Ajay Koli",
    twitter_card_type = "summary_large_image",
    twitter_creator = "@ajay_kolii"
  ) %>%
  include_meta()
```Copy Code

Embed

xaringanExtra::embed_xaringan(url="https://xeurmia.netlify.app/#1",
                              ratio = 3:1)Copy Code