Markdown博客写作从入门到自动化手把手教你把1小时排版时间缩短到10分钟


嘿,朋友。你是不是一边想着写博客,一边又被那些排版折腾得够呛?

换字体、调间距、找配图、对代码高亮……原本两分钟就能敲完的一段话,配上这些操作,硬生生拖上一个小时。等你终于发出去了,写作的热情也凉了一大半。

这文章,就是专门来帮你解决这个问题的。

我会带你从零开始,一步步把Markdown玩熟,再帮你搭一套自动化的工作流。等这阵子结束,你会发现——写博客,真的可以变成一件享受的事。


先问自己:为什么是Markdown?

你可能会说:Word不是也能排版吗?富文本编辑器点几下不就行了?

可以。但问题在于——你每次都要重新排

今天换了个新电脑,昨天的格式全乱。明天换了平台,又得重新调。更头疼的是,代码贴进去以后,缩进错乱、颜色不对、行号缺失,看着就难受。

Markdown解决的是内容与格式分离的问题。

你只负责写,格式交给规则。**加粗** 就是加粗,# 标题 就是标题,[链接](url) 就是链接。写完直接发布,无论在哪个平台、哪个设备上,呈现效果永远一致。

更重要的是,Markdown是纯文本。没有隐藏格式,没有兼容问题,随便一个记事本都能打开、编辑、传输。

如果你还在纠结”学不学Markdown”,我的建议是:别纠结了,现在就学。两小时入门,之后每天能省下几十分钟的排版时间。


Markdown基础:你只需要记住这些

别被那些长长的语法文档吓到。写博客真正用到的,其实就这几样。

标题

# 一级标题(页面主标题)
## 二级标题(章节)
### 三级标题(小节)

简单吧?三个符号就能搞定层级。不需要手动调字号、加粗、选颜色。

段落和换行

两个换行 = 新段落。想在一个段落里换行,行尾加两个空格再回车。

这是第一段。

这是第二段,中间有空行。

这是同一段里的换行,注意行尾的两个空格。  
接着写。

强调文字

*斜体*  或者 _斜体_

**加粗**  或者 __加粗__

***加粗斜体***

列表

有序列表用数字加点,无序列表用短横线或星号。

- 第一项
- 第二项
  - 子项(前面加两个空格)

1. 第一
2. 第二
3. 第三

链接和图片

[点击这里看Sapiens AI](https://www.sapiensai.com)

![一张描述性的图片](https://example.com/image.jpg)

注意:图片地址如果是本地的,有些平台会丢失。用图床(见后文)就能解决这个问题。

代码:这是Markdown真正发光的地方

如果你写过技术博客,这块你一定深有体会。普通编辑器贴代码,缩进全乱。Markdown不会。

行内代码用反引号:

用 `console.log()` 打印信息。

代码块用三个反引号,后面加上语言名,语法高亮自动生效:

```python
def hello_world():
    print("Hello, Markdown!")

hello_world()
```

```javascript
const greeting = "Hello, Markdown!";
console.log(greeting);
```

```bash
pip install markdown
python -m markdown index.md -o output.html
```

看,不同语言用不同颜色标识,缩进整齐,行号自动出现(取决于你的渲染器)。这就是Markdown比普通富文本强出十万八千里的地方。

引用

> 这是一段引用。
> 可以跨多行。
> 
> 里面还可以写**加粗**和`代码`。

分割线

---

***

表格

| 功能 | 难度 | 推荐度 |
|------|------|--------|
| 标题 | ⭐    | ⭐⭐⭐⭐⭐ |
| 代码块 | ⭐   | ⭐⭐⭐⭐⭐ |
| 表格 | ⭐⭐   | ⭐⭐⭐   |

选对工具:别再用记事本写博客了

Markdown语法很简单,但用记事本写是折磨自己。你需要一个好用的编辑器。

推荐1:Typora(所见即所得,入门首选)

Typora是目前最接近”写作体验”的Markdown编辑器。你敲下 **文字**,它立刻变成文字,而不是满屏的星号。

  • 界面简洁,没有多余按钮
  • 支持实时预览和源码模式切换
  • 价格一次性买断(付费版),或者用免费替代品
  • 导入导出方便,支持多种格式

如果你是第一次接触Markdown,Typora是你的最佳入门工具。

推荐2:VS Code + Markdown插件(进阶必备)

当你开始追求自动化,VS Code就无可替代了。

安装这几个扩展:

  • Markdown All in One:快捷键补全、表格编辑、目录生成
  • Markdown Preview Enhanced:更强的预览体验,支持导出PDF、HTML
  • Markdown Lint:语法检查,帮你发现格式问题
  • Prettier:自动格式化,保持代码风格一致

装好之后,按 Ctrl+Shift+V 就能在侧边栏实时预览。写完后一键导出为HTML或PDF。

推荐3:Obsidian(知识管理神器)

如果你不只是写博客,还想建立个人知识库,Obsidian值得试试。它基于本地Markdown文件,支持双向链接和图谱视图,把你的写作变成一张知识网络。


搭一个你自己的博客系统

光会写Markdown还不够,你得有个地方发布它。下面介绍几种方案,从最简单到最自动化。

方案一:直接用博客平台(最简单)

知乎、CSDN、掘金、WordPress.com,这些平台都支持Markdown输入。你写好直接粘贴,点发布,完事。

适合:不想折腾技术,只想快速发文章的人。

缺点:格式控制权弱,换平台就头疼,自定义能力差。

方案二:用静态站点生成器(推荐)

这是目前技术圈最主流的方式。你用Markdown写内容,一个工具把它转成HTML,部署到服务器上。整个过程可以全自动。

Hugo(Go语言,速度最快)

# 安装Hugo(macOS)
brew install hugo

# 创建一个新博客
hugo new site myblog
cd myblog

# 添加一个主题(以 PaperMod 为例)
git submodule add https://github.com/adityatelange/hugo-PaperMod themes/PaperMod

# 编辑配置文件
echo 'theme = "PaperMod"' >> hugo.toml
echo 'baseURL = "https://yourname.github.io/"' >> hugo.toml
echo 'title = "我的博客"' >> hugo.toml
# hugo.toml 完整配置示例
baseURL = "https://yourname.github.io/"
languageCode = "zh-cn"
title = "我的博客"
theme = "PaperMod"

[params]
  defaultTheme = "auto"
  showDarkToggl = true
  description = "记录技术和思考"

[menu]
  [[menu.main]]
    identifier = "posts"
    name = "文章"
    pageRef = "posts"
    weight = 10
# 创建一篇新文章
hugo new posts/hello-world.md

Hugo的好处是生成速度极快,几万篇文章也能在几秒钟内构建完成。

Hexo(Node.js,插件丰富)

# 安装Hexo
npm install -g hexo-cli

# 初始化博客
hexo init myblog
cd myblog
npm install

# 启动本地服务器
hexo server
# 访问 http://localhost:4000 查看效果

# 创建新文章
hexo new "我的第一篇文章"

Hexo的优势是主题和插件生态非常丰富,想加什么功能基本都有现成的。

方案三:GitHub Pages + 自动部署(完全免费+自动化)

这是最值得花时间去搭建的方案。你的博客托管在GitHub上,内容用Markdown写,每次提交代码就自动构建并发布。

具体步骤:

# 1. 在你的博客项目根目录创建 .github/workflows/deploy.yml
mkdir -p .github/workflows
# .github/workflows/deploy.yml
name: Deploy to GitHub Pages

on:
  push:
    branches:
      - main

jobs:
  build-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true

      - name: Build
        run: hugo --minify

      - name: Deploy
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./public
# 2. 在GitHub上创建同名仓库(yourname.github.io)
# 3. 把博客项目推上去
git init
git add .
git commit -m "Initial commit"
git remote add origin https://github.com/yourname/yourname.github.io.git
git push -u origin main

搞定。之后你只需要:

# 写文章
hugo new posts/my-new-post.md

# 编辑它(你的编辑器里打开)
code content/posts/my-new-post.md

# 预览
hugo server -D

# 提交并推送,GitHub Actions自动帮你构建发布
git add .
git commit -m "更新文章:xxx"
git push

推送完等一两分钟,你的博客就自动上线了。整个过程不需要你手动上传文件、配置服务器、安装环境。


自动化工作流:把时间真正省下来

前面讲的是工具链。现在来看看,怎么把你日常写作的流程也自动化掉。

步骤一:建立文章模板

每次写新文章都从零开始,浪费时间的。给自己定一个模板。

---
title: "{{title}}"
date: {{date}}
tags: []
categories: []
description: ""
---

# {{title}}

> 一句话总结这篇文章要讲什么。

## 背景

这里写背景信息。

## 核心内容

### 小节一

内容...

### 小节二

内容...

## 总结

一句话总结。

## 参考资料

- [链接1](url)
- [链接2](url)

在VS Code里安装 Snippet 插件,把这个模板存为代码片段。以后输入 mdnew 回车,模板自动出现,你只需要填内容。

步骤二:图片自动上传

图片是排版时间的最大杀手之一。本地路径在发布后全部失效。

解决方式:用图床。

推荐几个:

  • SM.MS:免费,注册后直接上传图片获取链接
  • Imgur:免费,无需注册也能用
  • Cloudinary:专业图床,支持自动优化

用脚本批量上传:

# upload_images.py
import requests
import os
import re

def upload_to_smms(image_path):
    """上传单张图片到SM.MS"""
    url = "https://sm.ms/api/v2/upload"
    headers = {
        "Authorization": "你的token"  # 在SM.MS官网注册后获取
    }
    with open(image_path, 'rb') as f:
        response = requests.post(url, files={"file": f}, headers=headers)
    data = response.json()
    if data.get("success"):
        return data["data"]["url"]
    return None

def process_markdown_file(md_path):
    """替换Markdown中的本地图片路径为图床链接"""
    with open(md_path, 'r', encoding='utf-8') as f:
        content = f.read()
    
    # 匹配本地图片路径
    image_pattern = r'!\[([^\]]*)\]\(([^)]+)\)'
    
    def replace_image(match):
        alt = match.group(1)
        path = match.group(2)
        if not path.startswith('http'):
            # 本地图片,上传
            full_path = os.path.join(os.path.dirname(md_path), path)
            if os.path.exists(full_path):
                url = upload_to_smms(full_path)
                if url:
                    print(f"  已上传: {path} -> {url}")
                    return f'![{alt}]({url})'
        return match.group(0)
    
    new_content = re.sub(image_pattern, replace_image, content)
    
    with open(md_path, 'w', encoding='utf-8') as f:
        f.write(new_content)
    
    print(f"完成处理: {md_path}")

if __name__ == "__main__":
    # 处理指定目录下的所有markdown文件
    md_dir = "content/posts/"
    for filename in os.listdir(md_dir):
        if filename.endswith('.md'):
            process_markdown_file(os.path.join(md_dir, filename))
# 使用前安装依赖
pip install requests

# 运行脚本
python upload_images.py

步骤三:一键生成+预览+发布

把上面的步骤串起来,写一个一键脚本。

#!/bin/bash
# deploy.sh - 一键部署博客

echo "🚀 开始部署博客..."

# 1. 上传图片
echo "📷 上传图片..."
python upload_images.py

# 2. 构建
echo "🔨 构建站点..."
hugo --minify

# 3. 本地预览(可选)
echo "👀 本地预览地址: http://localhost:1313"
hugo server --disableLiveReload --bind=0.0.0.0 &
PREVIEW_PID=$!

# 4. 等待用户确认
echo ""
echo "✅ 构建完成!按 Ctrl+C 停止预览,然后输入 'yes' 继续部署..."
read -p "确认部署? " confirm
if [ "$confirm" = "yes" ]; then
    kill $PREVIEW_PID
    echo "📤 推送到GitHub..."
    git add .
    git commit -m "更新: $(date '+%Y-%m-%d %H:%M')
    
    - 自动生成
    - 图片上传
    - 站点构建"
    git push
    echo "🎉 部署完成!访问 https://yourname.github.io 查看"
else
    kill $PREVIEW_PID
    echo "❌ 已取消部署"
fi

把这个脚本放到博客根目录,给执行权限:

chmod +x deploy.sh

以后写完文章,只要运行:

./deploy.sh

图片自动上传,站点自动构建,确认无误后一键推送到GitHub,GitHub Actions自动完成发布。

从写完文章到线上可访问,整个过程不超过30秒。

步骤四:自动化发布到多个平台

如果你的文章还需要同步到掘金、知乎、CSDN等平台,可以接它们的API。

以掘金为例:

# publish_to_juejin.py
import requests
import json

JUEJIN_TOKEN = "你的掘金token"  # 在掘金开发者中心获取

def publish_to_juejin(title, content, tags=None, category="frontend"):
    """发布文章到掘金"""
    url = "https://api.juejin.cn/content_api/v1/article/create_article"
    
    headers = {
        "Authorization": f"Bearer {JUEJIN_TOKEN}",
        "Content-Type": "application/json"
    }
    
    # Markdown转HTML(用marked库)
    import marked
    html_content = marked.parse(content)
    
    data = {
        "title": title,
        "content": html_content,
        "tags": tags or ["技术"],
        "category": category,
        "origin_link": "",
        "plan": "public"
    }
    
    response = requests.post(url, headers=headers, json=data)
    result = response.json()
    
    if result.get("err_no") == 0:
        article_id = result["data"]["article_id"]
        print(f"✅ 发布成功!文章链接: https://juejin.cn/post/{article_id}")
        return article_id
    else:
        print(f"❌ 发布失败: {result}")
        return None

if __name__ == "__main__":
    # 读取markdown文件并发布
    import sys
    if len(sys.argv) > 1:
        md_file = sys.argv[1]
        with open(md_file, 'r', encoding='utf-8') as f:
            lines = f.readlines()
        
        # 提取标题(第一个#开头的行)
        title = ""
        content_lines = []
        for line in lines:
            if line.startswith('# '):
                title = line.strip('# ').strip()
            else:
                content_lines.append(line)
        
        content = ''.join(content_lines)
        publish_to_juejin(title, content)
# 用法
python publish_to_juejin.py content/posts/my-post.md

时间对比:你真的省了多少?

让我给你一个真实的时间账本。

传统方式(以写一篇文章为例)

步骤 耗时
打开Word/富文本编辑器 1分钟
写内容 30分钟
调标题字号、加粗、间距 10分钟
插入图片、调整大小 10分钟
代码块排版(反复调整缩进) 15分钟
检查链接是否可用 5分钟
复制粘贴到博客平台 5分钟
平台内重新调格式 15分钟
预览、修改、再预览 10分钟
总计 约101分钟

Markdown自动化方式

步骤 耗时
打开VS Code 10秒
输入模板代码片段 mdnew 2秒
写内容 30分钟
运行 python upload_images.py 10秒
运行 ./deploy.sh,输入yes 20秒
GitHub Actions自动构建发布 等待1-2分钟(后台运行)
总计(手动操作时间) 约32分钟
真正节省的排版时间 约70分钟

而且,这70分钟是一次设置,永久享受的。等你习惯了这套流程,写作时间会进一步压缩——因为你不再需要分心去管格式。


几个实用的小技巧

技巧一:用别名加速常用操作

在终端里设几个别名,以后敲几个字母就能完成复杂操作。

# 添加到 ~/.zshrc 或 ~/.bashrc
alias hb='hugo server -D'           # 本地预览
alias hp='hugo && git push'         # 构建并推送
alias hi='python upload_images.py'  # 上传图片
alias ha='hugo && python upload_images.py && git add . && git commit -m "auto" && git push'  # 一键全部

技巧二:用Front Matter管理文章元数据

每篇Markdown文章的开头加一段YAML格式的配置,Hugo会自动解析。

---
title: "Markdown博客写作从入门到自动化"
date: 2024-01-15
lastmod: 2024-01-20
tags: ["markdown", "博客", "自动化", "教程"]
categories: ["技术分享"]
draft: false
description: "手把手教你用Markdown写博客,并通过自动化工具把排版时间从1小时缩短到10分钟。"
cover: "/images/cover.jpg"
---

draft: true 的文章不会发布,方便你写完先存着,确认无误后再改 false

技巧三:代码块行号配置

如果你在Hugo主题中想显示代码行号,在 hugo.toml 里加:

[markup]
  [markup.highlight]
    lineNos = true
    noClasses = false

技巧四:用相对路径管理图片

在Hugo中,把图片放在 assets/images/ 目录下,然后在文章中引用:

![图片描述](/images/photo.jpg)

这样Hugo构建时会自动处理路径,不需要上传到图床(适合图片不多的情况)。


常见问题解答

Q:Markdown不支持复杂的排版怎么办?

Markdown的设计哲学就是”只控制最基本的格式”。如果真需要复杂排版,可以:

  1. 直接写HTML标签(Markdown支持内嵌HTML)
  2. 用主题的CSS自定义样式
  3. 用插件扩展(Hexo有海量插件)

Q:换了电脑/系统,我的博客还在吗?

在的。你的所有文章都是Markdown文件,存在GitHub仓库里。换任何设备,git clone 一下就能继续写。

Q:我想加评论功能怎么办?

可以用 Disqus、Gitalk(基于GitHub Issues)、或者Valine(基于LeanCloud)。在主题配置里加几行就能搞定。

Q:SEO怎么做?

静态站的优势就是SEO友好。确保每篇文章的 titledescriptiontags 写完整,sitemap自动生成,Google和百度都能顺利抓取。Hugo和Hexo都有sitemap插件。


最后的建议

不要想着一次性把整套流程搭得完美无缺。

先选一个编辑器,学会基础语法,写一篇简单的文章发出去。等你尝到了Markdown的甜头,再去研究自动化。一步一步来,你不会觉得累,反而会有”原来这么简单”的成就感。

你现在花两小时学会的,会在未来的每一天里,帮你省下几十倍的时间。

写作本身就是一件值得专注的事。别让排版拖了后腿。


这篇文章本身就是用Markdown写的,用Hugo构建,通过GitHub Actions自动部署。如果你读完觉得有用,不妨就从这个流程开始——写你的第一篇文章,推送到GitHub,然后你就会明白,一切其实没那么复杂。