使用Blogdown在Hugo中的框架中显示代码块

Question

我最近使用blogdown和hugo创建了博客文章。我能够添加代码折叠，但是代码在网站上看起来像常规文本。我试图将代码显示在框架中或将其与其他文本（例如exp）区别开来：

我已经尝试了所有方法，但不知道该怎么做。我猜想它必须处理我正在使用的主题。我正在使用Hugo Nuo。

您可以在此处找到博客文章的当前形状： https://www.staturk.xyz/post/poll-accuracy-in-turkish-elections/

这是我试图在框架中显示代码的帖子的.rmd文件的开头：

---
title: "Poll Accuracy in Turkish Elections"
date: '2018-12-25'
slug: poll-accuracy-in-turkish-elections
tags:
- Polls
- Politics
- R
categories:
- Turkish Politics
- Rstats
---
```{r, echo=FALSE}
 htmltools::includeHTML("~/Documents/Personal/Projects/Blog/Turkstat/content/media/posts/header.html")
```

```{r echo = F, results='hide', message=FALSE}
library(tidyverse)
library(plyr)
library(stringr)
library(scales)
library(knitr)
```

Answer 1

这里有两个步骤-确定样式，然后将样式添加到主题。

弄清楚样式是什么

查看帖子的原始html（Chrome中的ctrl-U），将代码片段包装在<pre class="r"><code>..</code></pre>标记集中。因此，我们可以通过将以下内容添加到html标头中来为其设置边框（例如）：

<style>
  pre.r { 
    border-style: solid; 
    border-width: 2px; 
  }
</style>

添加到主题

看看主题代码，最好的方法似乎是重写themes/{theme_name}/layouts/partials/head.html中的head部分。将该文件复制到站点文件夹的同一区域。如果您使用的是Linux，则以下命令可以解决问题：

cd $sitedir
mkdir -p layouts/partials
cp themes/hugo-nuo/layouts/partial/head.html layouts/partial

然后编辑文件副本以添加上述样式片段。