一键美化 Notion 客户端，Windows 版本也能好看又实用

相信不只是我，用过（或看过）macOS 和 Windows 两个版本 Notion 客户端的同学，应该都会觉得 Windows 上的 Notion 用户「处于水深火热」之中。

Notion 的桌面客户端是「网页套壳」的成果，受限于 Windows 上的 Electron API，Notion 官方的 Windows 客户端拥有 Windows 桌面应用的一切特征：

不过 Notion 客户端是用 Electron 封装的，其样式、布局等和网页的定义方法一致。因此我们可以通过一些手段对 Notion 的 Windows 客户端进行定制，使之更符合我们的审美与使用习惯。比如下面这样：

魔改之后的 Notion Windows 客户端

这里用到的是来自乌克兰的开发者 @Uzver 的 Notion Enhancer，借助这款工具，我们可以对 Notion 的 Windows 桌面客户端进行一系列魔改和美化。

在开始美化 Notion 客户端之前我们需要安装一些工具，为接下来的魔改进行准备工作。下面的步骤在 Windows 10 Pro 19041.25 版本下进行，使用 Windows 上的软件包管理工具 Scoop 进行安装。

关联阅读：「一行代码」搞定软件安装卸载，用 Scoop 管理你的 Windows 软件

首先，Notion Enhancer 本身是一个 Python 脚本，我们需要安装 Python 环境。打开 PowerShell，在其中输入：

等待安装完成即可。

接下来，由于 Notion 的桌面客户端是 Electron 套壳应用，用 Node.js 作为其运行环境，因此我们需要安装 Node.js 与 npm 包管理工具。在 PowerShell 中继续输入：

等待安装完成即可。

最后，我们需要使用 npm 包管理工具安装 asar 工具，用来解密 Electron 应用包，从而改造 Electron 应用（也就是 Notion 客户端）的内部代码。在 PowerShell 中继续输入：

在 PowerShell 中输入 asar，如果出现如下的结果，那么我们的 asar 工具就安装成功了。

验证 asar 工具安装成功

至此，准备工作就基本完成了。

接下来，我们下载「美化」套装：Notion Scripts V4。解压之后我们会得到这样的几个文件：

Notion Enhancer 下载得到的文件

我们将 NotionScriptsV4 文件夹放置妥当（可以放在云存储同步文件夹中，方便后续保管），在 PowerShell 中定位至这一文件夹，进行接下来的「安装」操作。

关掉所有 Notion 客户端，在 PowerShell 中输入下面的命令，执行 Python 脚本：

执行 Customization Patcher 脚本

在这一步骤中，Customization Patcher.py 实际上为我们做了以下的事情：

随后重启 Notion 客户端就可以看到样式已经生效，客户端被我们成功魔改。

另外，如果后续希望将 Notion 客户端恢复原样，我们同样直接运行移除样式脚本 Customization Remover.py 即可：

将 Notion 客户端恢复原样

事实上，Notion Enhancer 为我们添加、修改并自定义了很多 Notion 客户端的功能与样式。

首先 Notion Enhancer 最大、最值得使用的功能特性就是将 Notion 原有的 Windows 菜单栏、工具栏与滚动条全部去掉，修改成了更符合 Notion 整体风格的样式。下面是一个对比：

Notion Enhancer 修改效果

可以看到，Notion Enhancer 将 Windows 原生的与 Notion 界面风格不匹配的控件全部隐藏了起来，并重绘了右上角的「最小化」、「最大化」和「关闭窗口」的控件，并将「滚动条」也重新绘制，使之与无论在深色主题还是浅色主题下都能完美契合。

另外，Notion Enhancer 还在右上角添加了一个实用的新控件 ↑，用于置顶 Notion 窗口。

Notion Enhancer 将 Notion 表格、看板视图左右两侧的「空白区域」去掉，从而让二者能显示更多的横向内容。

去掉表格视图两侧的空白部分

这部分样式在文件 custom_style.css 的 87 行往下开始定义的，如果不希望开启这一功能，我们直接删掉或注释掉 87 行至 97 行与 103 行至 107 行的代码内容（即下图中蓝色框中代码内容）即可。另外也可以在 Notion 客户端里面用快捷键 Ctrl + R 重新加载样式。

表格与看板视图的 CSS 样式定义

Notion Enhancer 将带有头图的页面也进行了相应的调整。为了使纵向空间充分利用，Notion Enhancer 将图标向上移动至头图中央，并调整了头图的显示区域。

调整图标与头图的位置

需要注意这部分样式定义是作者针对 15.6 寸与 24 寸显示器进行的参数调整，如果发现自己的 Notion 客户端显示出现了问题，那么我们需要手动调整这部分参数，也就是 custom_style.css 的第 109 行下面的部分。

这里我们需要调整两个 height 参数，其中 12vh、20vh 分别代表 Notion 页面内容距离顶端的高度与头图的显示高度，我们适当进行调整，使得图标在头图里面垂直居中即可。

修改头图与图标垂直高度

在上面的两个例子中可以看到，无论是桌面客户端的 Notion 还是网页版本的 Notion，其样式实际上是完全可以很大程度上进行自定义的。我们直接在 custom_style.css 里面添加或修改相应的 CSS 样式定义内容即可让 Notion 界面按照我们希望的样子显示。

添加自定义 Notion 样式

Notion Enhancer 还为我们添加了隐藏/显示 Notion 窗口的快捷键定义。

默认的隐藏 / 显示 Notion 快捷键是 Ctrl + Shift + A，不过我们也可以自定义这一功能。在 Customization Patcher.py 中，第 34 行定义了快捷键 windowToggleHotkey 的变量，这里我们就可以将默认定义的：

修改为我们自己的快捷键，比如 Win + Shift + N：

这里的修改需要重新运行 Customization Patcher.py，再次给 Notion 客户端打补丁，才能让快捷键生效。

最后，为了方便设置 Notion 开机自启以及启动的窗口样式，Notion Enhancer 还添加了一个任务栏设置区域，方便我们设置 Notion 开启启动、自动隐藏窗口、自动最大化窗口与最小化到托盘等选项。

添加 Notion 任务栏设置图标

为了拯救 Notion 的 Windows 用户于水深火热之中，Notion Enhancer 的作者也是煞费苦心，为我们修改了 Notion 的界面并提供了诸多增强功能，包括能够任意自定义 Notion 页面样式的入口：custom_style.css。

Notion Enhancer 目前已经更新至第四个版本，作者将在 Notion Enhancer - Notion 这一页面持续更新工具及其相应的功能和配置方法，感兴趣的同学可以持续关注。本文的介绍就到这里，感谢阅读。