Nested HTML elements with indenting breaks output

pensivedog commented 2 years ago

I'm trying to add some custom html elements and classes in an .Rmd file, as follows:

<section class="section">
  <div class="container">
    <div class="row">
      <div class="col">
        ```{r cars}
        summary(cars)

  </div>
</div>



When the elements are indented as above, they are simply rendered as code in a code block. But without any indentations, they are properly rendered as HTML.

In my blogdown theme I need a few landing pages with custom layouts that include charts and tables from R code chunks, like above. Not being able to indent nested html elements makes this much more difficult to manage.

Is this a bug or a feature? Is there a different approach I should be taking?

yihui commented 2 years ago

That's a basic Markdown feature: https://pandoc.org/MANUAL.html#indented-code-blocks

If you have pure raw HTML code, you can use the raw attribute: https://bookdown.org/yihui/rmarkdown-cookbook/raw-content.html But your problem is that you want to have both raw HTML and R code chunks, so you can't wrap everything into ````{=html}. It might work if you split the block into three pieces: raw HTML, R code chunk, and raw HTML. Then mark the two pieces of raw HTML as raw content separately.

Not being able to indent nested html elements makes this much more difficult to manage.

I don't quite understand how much more difficult it would be without indenting. As long as you don't indent by four or more spaces, it should be fine, e.g., you can indent by up to three spaces:

<section class="section">
 <div class="container">
  <div class="row">
   <div class="col">
   ```{r cars}
   summary(cars)

pensivedog commented 2 years ago

This is so helpful. Thank you for the explanation!

rstudio / blogdown

Nested HTML elements with indenting breaks output #724