How Can I Apply CSS Classes to Code Chunks in RMarkdown?

Applying CSS Class to Code Chunks in RMarkdown

If you wish to add a CSS class specifically to a code chunk in RMarkdown, there are methods to achieve this.

class.source and class.output Options

For knitr versions 1.16 and later, you can utilize the class.source and class.output options to assign HTML classes to source and output code chunks. For instance:

summary(cars)

This will add the 'myClass' class to the source code chunk.

Using fenced_code_attributes and knitr Hooks

Prior to knitr 1.16, you can leverage the fenced_code_attributes Pandoc extension in conjunction with an output hook in knitr. Consider the following:

---
title: "Untitled"
  output: 
    html_document:
      md_extensions: +fenced_code_attributes
---

knitr::knit_hooks$set(source = function(x, options) {
return(paste0(

"```{.r",
ifelse(is.null(options$class),
  "", 
  paste0(" .", gsub(" ", " .", options$class))
),
"}\n",
x,
"\n```"

))
})

Then, within the code chunk, you can specify the class as follows:

summary(cars)

This will render the code chunk with the HTML class:

</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><code>
    summary(cars)
<</code>/code>