Markdown

快速开始 在 Markdown 文章中插入 YouTube 视频非常简单，使用 Hugo 内置的短代码即可： 基本用法 1 {{< youtube VIDEO_ID >}} 实际示例 假设 YouTube 视频链接是：https://www.youtube.com/watch?v=dQw4w9WgXcQ 只需在文章中写入： 1 {{< youtube dQw4w9WgXcQ >}} 高级用法 设置自定义尺寸： 1 {{< youtube id="dQw4w9WgXcQ" width="100%" height="400" >}} 设置开始时间（从30秒开始）： 1 {{< youtube id="dQw4w9WgXcQ" start="30" >}} 获取视频ID的方法 打开 YouTube 视频 复制 URL 中 v= 后面的部分 例如：https://www.youtube.com/watch?v=ABC123DEF456 → ABC123DEF456 完整示例 1 2 3 4 5 6 7 8 9 10 11 12 --- title: "我的旅行记录" date: 2025-07-30 --- 这次旅行记录了很多美好瞬间： {{< youtube dQw4w9WgXcQ >}} 更多风景： {{< youtube m5d1FlB8kRs width="100%" height="400" >}} 现在你就可以在博客文章中轻松添加 YouTube 视频了！ ...

图片存放位置 在你的Hugo博客中，所有图片都应该放在 static/images/ 目录下： 1 2 3 4 5 6 7 8 static/ ├── images/ │ ├── posts/ # 文章相关图片 │ ├── logos/ # 品牌logo │ ├── screenshots/ # 软件截图 │ └── icons/ # 图标素材 ├── logo.svg # 网站logo └── favicon.svg # 网站图标 创建图片目录 让我们为这篇文章创建一个专门的图片目录： 1 mkdir -p static/images/posts/2025-07-30-image-guide/ 实际使用示例 1. 封面图片 在文章头部添加封面图： 1 2 3 4 --- title: "文章标题" image: "/images/posts/2025-07-30-image-guide/cover.jpg" --- 2. 内容图片 在正文中插入图片： 1 2 3   3. 图片对齐 使用HTML实现更复杂的布局： ...