
那些 Notion 的神奇操作
Notion 独特的风格一直受广泛的喜爱,Notion 也因此被世界各地的开发者们玩出了花样。
作为一个 Notion 热衷爱好者,当然少不了收集那些 Notion 有趣好玩的技巧。
Fruitionsite:使用 Notion 搭建属于你的网站
官网
实例
准备
- 一个公开的 Notion 页面
- 一个属于自己的域名
- 已经绑定自己域名的 Cloudflare 账户
优势
- 使用自己的域名
- 使用 Pretty Link 来替代繁琐的 pageID
- 可以设置自己喜欢的字体(基于 Google Fonts )
- 自由添加 JavaScript 来启用某些功能(比如使用 Google Analytics 来统计访问量)
- “几乎“ 0 成本
劣势
- Notion 页面上的所有工具都会同步启用,在一定程度上减慢了网站的访问速度
步骤
官网上也有完整的视频和文字教学
- 创建 Cloudflare 账号并绑定自己的域名(成功后如下所示)

- 主页进入 Workers,创建一个 Worker 项目(第一次设置时,需要设置 Workers 域名)

- 访问此网站,填写必要信息,之后按下 COPY THE CODE。

- 将代码粘贴至 Worker 项目里,并保存,修改名字为 fruitionsite(也可随意修改)
- 返回主页,点选 DNS 选项,添加 A 记录(推荐使用 A 记录)随便输入一个 IPv4 地址,并使用 Cloudflare 代理其流量,后保存。

- 转到 Workers 选项,添加路由,并保存
务必在路由最后添加 /*

- 大功告成。现在你可以使用此域名访问属于你的个人网站。

Super.so:简洁的网页,除了 Notion,其他都不要
官网
实例
准备
- 一个公开的 Notion 页面
- 一个属于自己的域名
优势
- 去除了 Notion 自带的工具/插件,让页面访问速度更快
- 可以免费尝试使用,之后将以每月 12 美元付费
React-Notion:使用 React 构建的 Notion 的快速渲染器
📌
技术含量 UP 🆙
官网
实例
准备
- 一个公开的 Notion 页面
- 一个属于自己的域名
- 编程“基础”
优势
- ⚡️ 快速 - 比 Notion 快 n 倍
- 🎯 准确
- 🔮 支持代码高亮 - 使用prismjs
- 🎨 可自定义样式
- “几乎” 0 成本
劣势
- 有一些 Notion Block 并不支持
- 需要自行搭建 notion-api (可选,可以用由 Splitbee 提供的 API)
步骤
React-Notion-X:又一个使用 React 构建的 Notion 的快速渲染器
📌
技术含量 UP 🆙
官网 & 实例
准备
- 一个公开的 Notion 页面
- 一个属于自己的域名
- 编程“基础”
优势
- 🚀 简单 - TypeScript + React。
- ⚡ 快速 - 比 Notion 快 10-100 倍
- 🔮 支持代码高亮 - 使用prismjs
- 🎨 可自定义样式
- “几乎” 0 成本
- 支持“几乎”全部 Notion Blocks
步骤
和 React-Notion 类似
Notion Web Clipper(Chrome 插件)
官网
下载
优势
- 由 Notion 官方推出
- 支持将当前页面快速保存至 Notion
Notion Enhancer(桌面端插件)
官网
优势 & 介绍
- Notion + Notion