type
status
date
slug
summary
tags
category
icon
password
如果你习惯记录自己的学习 / 生活,又不喜欢各大平台的局限性,想要更自由的记录,那不妨自己搭建一个个人博客吧!本文介绍了一个相对简易且完全免费的个人博客搭建指南。完成后的网站样式可参考下图:
一、工具介绍
- Github:一个代码托管平台,拥有一个 GitHub 账号是完成本文博客搭建的前提。
- NotionNext:一个基于 Nobelium 的静态博客生成工具,原理是通过 Notion 公开页面抓取并添加样式的方式来生成博客。NotionNext 继承了 Nobelium 的优点,并在其基础上作了美化以及更多的特性支持。
- Vercel:一项对开源项目免费的托管服务,能够将自动开发模式下的代码转换为对外服务的网页,功能十分完善对新手相当友好。
二、开始配置
Step 1:Notion 配置
- Duplicate 模板:Notion Blog Template
- 点击右上角
Share
按钮将页面属性设为公开
- 复制
Page ID
即图中方框内这串数字,稍后会用到
Setp 2:项目配置
- Fork
NotionNext
项目到个人仓库
- 自定义网站配置有两种方式:
- 修改个人仓库中的
blog.config.js
文件,备注很清晰,按需对照修改即可。但这样会有个弊端,如果上游项目更新的话,可能会与个人仓库的内容冲突导致拉取失败或者覆盖已修改内容。 - (建议)修改 Vercel 项目中的环境变量,参考下方 Step 3 的第三点。用环境变量的好处是其不会随项目更新而丢失修改,用起来更加省心,所以能够配置环境变量的属性优先选择环境变量。但是像网站主题之类的自定义项支持配置环境变量,如需修改可以参考下这篇文章。
Step 3:Vercel 配置
- 打开 https://vercel.com/ ,
Sign up
选择Continue with GitHub
- 创建新项目,左侧找到 NotionNext 点击
Import
- 配置时可修改项目名称并配置环境变量。也可以部署好后再到 Vercel 项目主页点击
Settings
,,并选择Environment Variables
配置环境变量
- 完成之后点击
Deploy
即可自动完成部署
- 如果你有自己的域名,那么可以在 Vercel 中打开项目,选择
Settings
,然后选中Domains
,添加自己的域名即可。添加后,需要去域名服务商中,设置一下解析为CNAME
解析。
三、发布内容
部署完博客,那么我们如何发布内容呢?很简单,只需要在 Notion 数据库中新建一个
type=post
的页面即可,Notion 页面的各个属性含义如下:属性 | 必填 | 说明 | 备注 |
title | 是 | 菜单栏中的标题 | ㅤ |
status | 是 | 发布状态 | 仅当状态为 Published 时会被展示 |
type | 是 | page / post | page 为网站页面,post 为博文 |
slug | 否 | 单页短路径例如 /about | 每篇文章的地址唯一,请勿重复 |
icon | 否 | 菜单栏图标(仅Page类型有效) | |
summary | 否 | 内容摘要 | 搜索和文章简略显示会用到 |
date | 是 | 发布日期 | ㅤ |
category | 否 | 文章分类 | 可以自定义 |
tags | 否 | 文章标签 | 可以自定义 |
以本文为例,想要在网站中显示,只需像下图这样设置:
如果你想要网站的 Banner 页支持二级菜单,可参考 NotionNext升级操作指南。
四、尾巴
NotionNext 同时还支持网站信息统计以及评论系统等功能,我们后面再继续讨论。如果你有任何问题或建议,欢迎在评论区留言。
- Author:Jarrett Au
- URL:https://blog.coding-park.top//article/notion-blog
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!