.Rmarkdown to .markdown: Use {{< figure >}} shortcode instead of <img> HTML

Question

I've been looking into using blogdown for my existing Hugo blog and I think I've narrowed it down to one shortcoming. I'm using the .Rmarkdown file extension because I want to use the Blackfriday markdown processor to take advantage of Hugo features.

Among those is a customization I've added to my theme, which takes any image embedded with the built-in shortcode uses PhotoSwipe to make them appear in a lightbox on click. I've made it so that anything using the {{< figure >}} shortcode does this.

Is it possible either via blogdown or knitr (assuming knitr is part of the process of rendering the Rmarkdown) to customize the output of plots so they are wrapped in the shortcode rather than HTML tags? I think it might even be possible to do this with Go/Blackfriday if I could at least get the plots to be formatted in Markdown ![](/path/to/img.jpg), if that would somehow be easier.

Answer 1

There are two ways: either redefine the plot hook of knitr (requires more knowledge about knitr), or use the following trick:

```{r cars-plot, fig.show='hide'}
plot(cars)
```

{{< figure src="`r knitr::fig_chunk('cars-plot', 'png')`" >}}

In the above example, the plot was generated but hidden in the chunk output (fig.show='hide'; if you want hide the whole code chunk, use include=FALSE). Then its path is retrieved via the function knitr::fig_chunk() and inserted in the figure shortcode.