編輯文章
靜態網站產生文章的方法其實有點麻煩，它沒有後臺，沒有文章編輯器，我都是直接在VScode上直接打字，然後對照網頁。
新增文章
每次要發布新文章，都需要創一個.md結尾的Markdown檔案。
因為我的網站其中一個主題是食記，個人習慣在發布文章的資料夾裡創建一個新資料夾，把食記的圖片和Markdown檔案放在一起。
通常 資料夾的名稱會取為2023-03-22-restaurant，再創一個2023-03-22-restaurant.md檔案，直接用時間做檔名的好處就是會依時間排序，然後文章就會直接顯示是2023年3月22日發布。
前言 (frontmatter)
前言會放在檔案最上方，撇除內容，以下是我比較常進行的設定：
文檔文章
我通常會放標題、側邊欄位置、側邊欄名稱、描述和標籤。
---
title: 編輯文章
sidebar_position: 10
sidebar_label: 編輯文章
description: 網站上線後，開始產出內容，編輯文章。
tags: [article, docusaurus]
---
部落格文章
我通常會放標題、描述、網址、縮圖和標籤。
---
title: 嘉義市｜雅米食堂
description: CP值高份量多，提供定食、烏龍麵、丼飯和單點品項，也可以自由組合選擇自己想要的主食、主餐和配菜，自行搭配符合自己口味的套餐。
slug: yami_restaurant
image: /img/cover/yami_restaurant.webp
tags: [嘉義市, 日式餐廳]
---
CP值高份量多，提供定食、烏龍麵、丼飯和單點品項，也可以自由組合選擇自己想要的主食、主餐和配菜，自行搭配符合自己口味的套餐。
<!--truncate-->
封面或縮圖
會將封面照片另外放在static資料夾中，image設定好的圖片，會在google搜尋時出現縮圖，這同時也是我設定網站首頁文章圖片的方式。
描述
雖然有打上description，但我發現google搜尋出來的結果，不一定是設定的description內容，反而滿常是第一段文字，所以我後來乾脆description和第一段文字內容就寫一樣。
草稿
在frontmatter裡加上draft: true，文章就會變成草稿，有時打到一半還沒有要發布，或是想再調整，會設定為草稿，這樣就只有自己編輯時可見。
文章內容
閱讀更多
部落格食記文章，我會先放一張圖片和一小段摘要，接著使用<!--truncate-->隱藏其他文章內容。
標題
是用#決定標題的層級，標題樣式在custom.css統一設定，我目前的標題樣式在字體設定有寫過。
# h1標籤
## h2標籤
### h3標籤
以此類推
粗體
有時候在內文中有想要強調的重點，會幫文字加粗體。
有時候在內文中有想要強調的重點，會幫文字加**粗體**。
超連結
請點擊Docusaurus官網觀看更多教學。
請點擊[Docusaurus官網](https://docusaurus.io/zh-CN/docs/markdown-features)觀看更多教學。
圖片
圖片都是直接用Markdown語法寫的。
告示
一種特殊的告示方式，我很少用。
:::note
這是備註
:::
:::tip
這是提示
:::
:::info
這是信息
:::
:::caution
這是警告
:::
:::danger
這是危險
:::
呈現出來的效果如下：
這是備註
這是提示
這是信息
這是警告
這是危險
程式碼區塊
網站設定系列文章難免會寫到程式碼，我通常會設定title標題，showLineNumbers顯示行數，{數字}將想要的程式碼醒目標示。
```javascript title="實際模樣" showLineNumbers {2,4-5}
---
title: 編輯文章
sidebar_position: 10
sidebar_label: 編輯文章
description: 網站上線後，開始產出內容，編輯文章。
tags: [article, docusaurus]
---
```(前後用```將程式碼包起來)
---
title: 編輯文章
sidebar_position: 10
sidebar_label: 編輯文章
description: 網站上線後，開始產出內容，編輯文章。
tags: [article, docusaurus]
---