1.1 新建文档放哪？

新建博客一般新开一个子文件夹，把博客文档以及相关图片、pdf文件等资料都放在一起。

• 如果撰写英文博客，文档放在文件夹content/en/post/
  
• 如果撰写中文博客，文档放在文件夹content/zh/post/

1.2 新博客有哪些文件类型？

博客文件可保存为三种类型：

• .md：一般的markdown文件，不能运行R程序；
  
• .Rmd：R Markdown文件，可以跑R程序，直接输出代码和结果。缺点是需要更长运行时间，会产生html网页文件；
  
• .Rmarkdown：也是R Markdown文件，但运行R的是Hugo而不是Pandoc，因此功能有一定限制，比如不能引用参考文献，数学公式要安装软件包xaringan（简单好用的网页幻灯片）才行。

1.3 博客文档的前置部分

对于.Rmd文档，可参考本博客：

---
title: 如何撰写新博客？
author: Fiona
date: '2020-01-26'
slug: blogdown
categories:
  - R
tags:
  - Blog
image:
  caption: ''
  focal_point: ''
output:
  blogdown::html_page:
    toc: true  #显示目录
    toc_depth: 2 #目录层次 
    number_sections: true  #章节编号
---

对于.md文档，可参考：

+++
date = "2016-04-20T10:00:00"
draft = false
tags = []
title = "Writing content with Markdown, LaTeX, and Shortcodes"
math = true
+++

2.1 Sub-headings

## Heading 2
### Heading 3
#### Heading 4
##### Heading 5
###### Heading 6

2.2 Emphasis

Italics with *asterisks* or _underscores_.

Bold with **asterisks** or __underscores__.

Combined emphasis with **asterisks and _underscores_**.

Strikethrough with ~~two tildes~~.

2.3 Ordered lists

1. First item
2. Another item

2.4 Unordered lists

* First item
* Another item

2.5 Images

Images may be added to a page by placing them in your post folder and referencing them using one of the following two notations:

A general image:

![](./music.png)

Beautiful music

A unified approach by knitr:

knitr::include_graphics('music.png')

Figure 2.1: 插入本地图形(带编号和标题)

2.6 Links

[I'm a link](https://www.google.com)
[A post]({{</* ref "post/hi.md" */>}})
[A publication]({{</* ref "publication/hi.md" */>}})
[A project]({{</* ref "project/hi.md" */>}})
[Another section]({{</* relref "hi.md#who" */>}})

2.7 Emojis

See the Emoji cheat sheet for available emoticons. The following serves as an example, but you should remove the spaces between each emoji name and pair of semicolons:

I : heart : Academic : smile :

I ❤ Academic 😄

2.8 Blockquote

> This is a blockquote.

This is a blockquote.

2.9 Footnotes

I have more [^1] to say.

[^1]: Footnote example.

I have more [^1] to say. [^1]: Footnote example.

2.10 Code highlighting

Pass the language of the code, such as python, as a parameter after three backticks:

```python
# Example of code highlighting
input_string_var = input("Enter some data: ")
print("You entered: {}".format(input_string_var))
```

Result:

# Example of code highlighting
input_string_var = input("Enter some data: ")
print("You entered: {}".format(input_string_var))

2.11 Twitter tweet

To include a single tweet, pass the tweet’s ID from the tweet’s URL as parameter to the shortcode:

{{</* tweet 666616452582129664 */>}}

2.12 GitHub gist

{{</* gist USERNAME GIST-ID  */>}}

2.13 Speaker Deck

{{</* speakerdeck 4e8126e72d853c0060001f97 */>}}

2.14 \(\rm \LaTeX\) math

$$\left [ – \frac{\hbar^2}{2 m} \frac{\partial^2}{\partial x^2} + V \right ] \Psi = i \hbar \frac{\partial}{\partial t} \Psi$$

\[\left [ – \frac{\hbar^2}{2 m} \frac{\partial^2}{\partial x^2} + V \right ] \Psi = i \hbar \frac{\partial}{\partial t} \Psi\]

Alternatively, inline math can be written by wrapping the formula with only a single $:

This is inline: $\mathbf{y} = \mathbf{X}\boldsymbol\beta + \boldsymbol\varepsilon$

This is inline: \(\mathbf{y} = \mathbf{X}\boldsymbol\beta + \boldsymbol\varepsilon\)

2.15 Table

Code:

| Command           | Description                    |
| ------------------| ------------------------------ |
| `hugo`            | Build your website.            |
| `hugo serve -w`   | View your website.             |

Result:

2.16 Alerts

Alerts are a useful feature that add side content such as tips, notes, or warnings to your articles. They are especially handy when writing educational tutorial-style articles. Use the corresponding shortcodes to enable alerts inside your content:

{{% alert note %}}
Here's a tip or note...
{{% /alert %}}

This will display the following note block:

{{% alert warning %}}
Here's some important information...
{{% /alert %}}

This will display the following warning block:

3.1 如何插入B站视频?

来源于下面帖子：https://www.shenxt.info/zh/post/blogdown/.

（1）点开想要插入的视频,点击分享.然后点击嵌入代码,复制代码,插入到markdown文件中即可.

（2）调整视频显示大小。直接嵌入的视频长宽不一定合适,需要手动调整.

首先设置宽度为100%，并设置一个id （如下设置ID为test）：

<iframe id="test" src="//player.bilibili.com/player.html?aid=23877090&cid=39940519&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true" width=100%> </iframe>

然后在markdown中插入如下JS代码:

<script type="text/javascript">
document.getElementById("test").style.height=document.getElementById("test").scrollWidth*0.76+"px";
</script>

结果如下：

3.2 如何在.md文件中插入视频？

{{< video library="1" src="my_video.mp4" controls="yes" >}}

{{< video src="my_video.mp4" controls="yes" >}}

{{< youtube w7Ft2ymGmfc >}}

{{< vimeo 146022717 >}}

3.3 如何在.Rmd文件中插入视频？

使用shortcode()函数.

blogdown::shortcode("video", src = "ren_stat.mp4", controls="yes")

blogdown::shortcode("youtube", "p4liifrbK8w")