在RStudio的书本中创建自定义块 [英] creating custom blocks in RStudio's bookdown

问题描述

我正在尝试新的很棒的软件包

AFAIK，没有一个示例定义此示例带图标的特定块。我对CSS不太了解，因此寻找可以修改的内容。

我想使用

I认为我需要复制fontawesome目录，指定包含的fontawesome css文件的路径（某个位置，不确定位置），并在我的计算机中使用< i> 标记 div 定义，例如< i class = fa fa-comment>< / i> 。

解决方案

感谢

I'm experimenting with the great new package bookdown to create a gitbook-style book using RMarkdown within RStudio. See here.

My question is about creating custom blocks. There is an example in the documentation of how to define a block style in a CSS file:

div.FOO {
  font-weight: bold;
  color: red;
} 

And the authors give some examples of what blocks might look like.

AFAIK, there is not an example of how to define this specific block with an icon. I don't know much about CSS, so looking for something I can modify.

I'd like to use font awesome icons like Leanpub does to create some special sidebars. Any ideas for creating something like this:

I think I would need to copy the fontawesome directory, specify the path to the included fontawesome css file (somewhere, not sure where), and use the <i> tag in my div definition, e.g., <i class="fa fa-comment"></i>. Not real clear on how to implement this though...or if it would even work.

解决方案

Thanks to @Frank's tip (see his solution for using local images), I was able to come up with the following.

I added this to the style.css file in the root of my book's directory based on this SO answer and this specific example:

.rmdcomment {
  padding: 1em 1em 1em 4em;
  margin-bottom: 10px;
  background: #f5f5f5;
  position:relative;
}

.rmdcomment:before {
    content: "\f075";
    font-family: FontAwesome;
    left:10px;
    position:absolute;
    top:0px;
    font-size: 45px;
 }

I got the value f075 for the comment icon from this FontAwesome cheatsheet.

Then I downloaded the CSS toolkit from FontAwesome and copied the font-awesome.min.css file into the root of my book directory. I added the following to my output.yml file (in the template I started with, style.css, toc.css was already present):

bookdown::html_book:
  css: [style.css, toc.css, font-awesome.min.css]

Finally, I inserted a code chunk into my Rmd file using the type option:

```{block, type='rmdcomment'}
Some text for this block. Some text for this block. Some text for this block. Some text for this block. Some text for this block. Some text for this block.
```

这篇关于在RStudio的书本中创建自定义块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！