开通VIP，畅享免费电子书等14项超值服
首页
好书
留言交流
下载APP
联系客服
2023.06.17江苏
科技小飞哥科技小飞哥2023-06-1717:39发表于新加坡
63篇原创内容
公众号
我之前搭建过两个个人网站：
Hugo搭建博客需要一定的编程基础并且执行开发命令，对零基础的小伙伴来说有一定的难度，但是可定制化更强，有更多的主题可以选择。
而Notion来说对小白就非常友好了，你不需要任何编程基础，只需要写一个文档，就可以帮你自动部署。
如果你没有notion账号，可以注册一个notion账号，可以使用email地址或者google地址注册。
侧边栏可以创建非常丰富的笔记类型，能满足基本所有的效率笔记需求。
我之前也做了Notion的使用和汉化教程，有兴趣的可以查看视频下方的描述栏。
然后点击右上角的Duplicate也就是复制，把模版克隆到你的账号下面，这样你就可以开始创作了。
我们把模版克隆到到个人账户之后，点击右上角的Share->Publish->PublishtoWeb，那么互联网上的用户就能使用这个链接来访问我们的个人页面了。
而这个页面就是你个人网站的内容编辑页面，我们先不修改，等部署之后再慢慢修改。
ForkNotionNext到你的Github账号
我们可以看到它有多种主题，如果你喜欢哪个，可以在部署后切换主题。
我们点击右上角的Fork按钮来克隆项目到你的Github账户下：
Fork后就会弹出如下界面，点击CreateFork，就会在你的Github账号里面拷贝一份代码。
这份代码就是我们搭建个人网站的关键，这个NotionNext调用了Notion的API来展示Notion的页面，同时提供了一些主题和特效，可以定制化我们的网站效果。
直接点击右上角的SignUp使用刚才的github账号注册，因为部署的大部分项目都是从Github仓库导入的。
注册之后可能需要你验证手机号码，中国大陆的+86手机号码是可以验证的，直接输入就可以验证。验证之后进入到Vercel账号里面。
第一步是新建项目
导入Git仓库，可以选择导入所有仓库，也可以选择导入指定仓库NotionNext
在仓库列表里面NotionNext然后点击Import
配置你的notionnext
点击EnvironmentVariables，我们需要配置环境变量
Name:NOTION_PAGE_IDValue:e4bc192eb3ac47b18c0a547fc127f542
注：Value是你的Notion个人主页的值，我们从我们之前的那个Notion模版里面点击Share->Sharetoweb->Copyweblink
可以看到我们的link
点击Deploy，然后等两分钟，就可以部署成功了。
然后点击图片，就会自动跳转到Vercel自动分配给你的域名来访你的个人网站了。
由于域名污染，vercel自动分配域名可能访问不成功，没关系，我们下一步申请域名来绑定到个人网站来访问。
申请非常简单，如果你想免费白嫖，可以看之前我的申请免费域名的教程。
如果你觉得麻烦，可以去域名供应商购买一个付费域名也是可以的。
有了域名之后就是域名配置，我们直接在setting里面找到domain然后配置域名，填写你白嫖或者购买的域名，配置后会要求你在域名解析商里面填两条记录。
一条是A记录，一条是CNAME记录。我是用Cloudflare解析的，我直接去Cloudflare填上这两个记录，如果你使用的其它的平台，比如阿里云，腾讯云之类的，也可以直接在上面填写记录。
填写记录之后Vercel显示成功。
就可以直接使用你的域名跳转到个人网站了。
网站部署成功之后我们就可以配置主题以及内容来定制化我们的个人网站了，我们先修改主题和展示效果，这个我们在github的NotionNext仓库的blog.config.js里面可以看到。
我们有两种方式可以修改：
1.一种是直接修改这个blog.config.js文件，修改之后会自动触发vercel部署。2.一种是使用vercel项目的环境变量EnvironmentVariables修改，这里的修改会覆盖掉blog.config.js的内容。
文件里面每一行的作用都有详细的注释，你可以根据需求修改。我们在Github上的修改，无需重新部署，Vercel会监听Github的修改，自动部署。
同时NotionNext代码仓库还有着其它非常丰富的配置可以修改，甚至可以显示主题选项，随时一键切换主题，显示鼠标点击特效，动态特效，宠物挂件，音乐播放插件，等等。
这些都等着你探索。
我们回到Notion网站，可以看到我们的Notion模版，这个模版是一个表格，表格的每一行是一篇博客，我们可以在表格上面进行编辑，最终会反馈到我们的个人网站上面去。
解释一下表格各个列的意义：
·type-Post：博客，Page：菜单（归档，留言，友链等），Notice：公告·status-Published:已发布，Invisible：不可见，Draft：草稿·title-具体的博客内容，点击Open即可打开编辑·slug-链接后缀，不填就是默认的notion的随机字符串，可读性不好，建议填写
其他的列都比较简单就不介绍了。
点击+New可以添加新的一行，也就是新的一篇博客，点击文档图标打开具体的博客内容进行编辑，Notion文档支持markdown语法。
我们输入/就可以编辑特定格式的文本，比如添加页面，待办列表，标题，表格，有序列表，无序列表，甚至还能添加媒体，比如图片，视频，音频，代码，文件等等。
在Vercl平台，点击项目，BuildLogs->Redeploy就可以了。
现在我们就完整搭建了一个个人网站，是不是觉得成就感满满。赶紧尝试吧。
///
但是Notion有一个非常不友好的地方在于，他不支持中文版。无论是网页版还是电脑版还是手机版都不支持中文版。
这篇教程我来教大家如何让Notion在各平台支持中文。
我要讲的第一种方式，就是使用NotionCn插件这个方式适合使用网页版Notion的用户。
前往Notion网页端，刷新重新加载页面即可完成汉化。
这个插件的翻译是经过开发者人工校对，翻译结果比较准确。
我们下一步就是安装汉化脚本，而汉化脚本主要基于官方中文词条+人工校对，可以说是目前翻译精度最高的汉化脚本。
在Notion快捷方式下右键选择打开文件所在的位置，打开renderer文件夹：\resources\app\renderer\。
把notion-zh_CN.js复制到上述renderer文件夹；
在上述renderer文件夹中使用编译器打开preload.js；
然后在在preload.js的最后一行添加以下代码：
重启Notion完成汉化
打开Finder>>应用程序，右键点击Notion，点击显示包内容。
打开Contents\Resources\app\renderer\目录
把notion-zh_CN.js放到上述renderer文件夹；
使用编译器打开preload.js，然后在preload.js的最后一行添加以下代码：
重启Notion，然后点击左边的Settings&members，选择Language&Region，然后随便选择一种语言，比如我选择日本语，然后自动会切换成中文。
因为我们安装了汉化包，所以无论我们选择什么语言都被中文覆盖。
直接在Android手机下载汉化版APK应用程序。
根据Notion-zh_CN汉化脚本的github文档，目前它还没有发布适用于苹果iOS系统的版本，iphone用户请耐心等待更新。