短代碼

本文將簡單地介紹如何利用短代碼來豐富你的內容，並列出一些可用的短代碼。

使用短代碼

另請參閱 use shortcodes。

Hugo 內置短代碼

• Figure： 是 Markdown 中圖像語法的延伸。
• Gist：顯示 GitHub gist 代碼。
• Highlight：顯示高亮代碼。
• Instagram：顯示一篇 Instagram 帖子。
• Param：獲取當前頁面的參數，如無則回退到網站參數。
• ref and relref：返回指定頁面的固定鏈接（ref）或相對固定鏈接（relref）。
• Tweet：顯示 Twitter 推文。
• Vimeo：顯示 Vimeo 視頻。
• YouTube：顯示 YouTube 視頻。

Bootstrap 短代碼

Module Path	Version
github.com/hugomods/bootstrap

Bootstrap 短代碼列表。

• Alert：顯示警告信息，支持多種樣式、圖標和標題。
• Clearfix：清除浮動的內容，如浮動圖片。
• Collapse：隱藏和顯示內容。
• Config Toggle：從一個代碼庫中生成一個配置切換，支持 YAML、TOML 和 JSON。
• Icon Grid：顯示帶有圖標、標題和描述的 icon grid。
• Lead：使一個段落脫穎而出。
• Ratio：完美的響應式處理視頻或幻燈片的嵌入，基於父體的寬度。
• Toggle：比 config toggle 更加通用，設計用於任何內容，如 SDK 代碼。

擴展的短代碼

Module Path	Version
github.com/hugomods/shortcodes

擴展的短代碼列表。

線上代碼編輯器

• CodePen：顯示 CodePen 代碼。
• JSFiddle：顯示 JSFiddle 代碼。
• JSRun：顯示 JSRun 代碼。

媒體播放器

• Asciinema：顯示 asciinema 視頻。
• Bilibili：顯示嗶哩嗶哩視頻。
• NetEase Cloud Music：顯示網易雲音樂播放器。
• YouKu：顯示優酷視頻。

由模塊提供的短代碼

你可能需要安裝相應的模塊來使用以下短代碼。

• 加密：加密內容。
• 圖標：顯示圖標。
• 圖片鏈接：當點擊圖片鏈接時彈出一個圖片。
• KaTex：數學排版。
• Mermaid：使用受 Markdown 啓發的文本定義和一個渲染器來創建和修改複雜的圖表。
• Video.js：自定義屬於你自己的視頻播放器。