題圖：來自 Dribbble @Alexander Shatov
Hello 大家好，我是安哥。
今天繼續來介紹介紹多合一的筆記工具 Notion 的一些用法，包含美化客戶端、為網頁版 Notion 新增側邊目錄，以及解決 Notion 匯出 Markdown 圖片丟失的問題。
01. 美化 Notion 客戶端
下圖是 Notion Windows 客戶端美化之前預設的介面：
再給各位看一下美化之後的效果，作為對比：
變化最明顯的地方在於，美化之後的客戶端去掉了頂部左上角的頁面標題和工具欄，原先位於下方的使用者名稱移動到了左側的頂部，且右側的最小化、關閉按鈕的位置向下移動了，看起來更舒服。
美化 Notion 客戶端，需要為我們電腦安裝一個名為 Notion enhancer 的外掛，這個外掛除了可以美化客戶端，還可以為客戶端增加一些額外的功能，例如視窗置頂、滑動到頁面頂部、字數統計等。
安裝 Notion enhancer 外掛之前，需要為你的電腦安裝 Node.js ，它是一個程式設計師經常會用到的 JavaScript 執行環境，可通過它整合的 npm 包管理工具來安裝我們需要的 Notion 美化外掛。
如果看不懂上面的內容也沒關係，開啟 Node.js 官網，選擇下載左側的 14.16.1 版本，下載之後按照普通軟體的安裝——點選多次「下一步」——直至完成安裝。
Node.js 官網： nodejs.org/en/
在進行下面的操作之前，請先徹底退出正在執行的 Notion 程式，保險起見，你可以使用工作管理員關閉當前正在執行的 Notion。
使用快捷鍵 Win + S 開啟 Windows 自帶的搜尋功能，輸入 cmd，上方會返回「命令提示符」，右擊此選項，選擇「以管理員身份執行」。
在開啟的命令列視窗中，輸入 npm i -g notion-enhancer 並按下Enter鍵，等待下方返回外掛的版本號 notion-enhancer@0.10.2 ，則表示完成了美化外掛的安裝。
但是，安裝這個外掛之後，會導致 Notion 無法正常開啟，這可能是因為外掛與 Notion 不相容所導致的，因此我們還需要對安裝的外掛程式碼進行一點小修改。
按照路徑 C:\Users*電腦使用者名稱*\AppData\Roaming\npm\node_modules\notion-enhancer\mods\core 開啟外掛安裝的位置。
對於不同的電腦，路徑中的「電腦使用者名稱」並不是統一的，需要根據你的使用者名稱進行相應的變化。
下圖就是美化外掛在我電腦上的安裝位置，我們需要**修改的檔案有兩個：client.js 和 createWindow.js **。
右擊需要修改的 client.js 檔案，選擇「開啟方式」，你可以選擇以「記事本」開啟，也可以使用專業的程式碼編輯器，例如 Visual Studio Code 開啟。
這裡建議使用程式碼編輯器開啟，因為等會找起程式碼來比較方便。
開啟 client.js 之後，找到第 108 行程式碼，這時就可以體現出使用程式碼編輯器開啟檔案的好處了：它會在檔案的左側欄顯示當前的程式碼行數。
先複製下方的程式碼，接著用滑鼠選中第 108 行的內容，使用 Ctrl + V **貼上替換 **client.js 檔案中原有的程式碼。
!document.querySelector('.notion-topbar > div[style*="display: flex"]')
複製程式碼
替換之後，點選軟體左上角的「File」，選擇「Save」儲存剛做出的變化，當然直接使用快捷鍵 Ctrl + S，同樣可以儲存修改。
接著開啟另外一個需要修改的檔案 createWindow.js ，找到第 19 行，會發現這一行是空白的，我們需要往這一行新增新的程式碼。
複製下方的程式碼，將其貼上到上圖的第 19 行空白處，接著同樣按下 Ctrl + S，儲存剛作出的修改。
__exports.getIndexUrl = require(`${helpers
.getNotionResources()
.replace(/\\/g, '/')}/app/helpers/urlHelpers.js`).getIndexUrl;
複製程式碼如果你覺得上面修改兩個檔案程式碼的操作比較麻煩，可以考慮另外一種方法：下載我修改好的兩個檔案，將其放到 Notion enhancer 外掛的安裝位置，替換原有的檔案。
替換檔案下載連結： wwx.lanzoui.com/iNIVmov5hna
完成以上操作之後，重啟 Notion，Notion 就可以正常開啟了，細心的朋友可能還會發現，桌面右下角工作列的 Notion 圖示也變了。
右擊 Notion 圖示，會發現彈出的皮膚中的選項也變了，這裡我們選擇「Enhancements」，開啟 Notion 功能增強皮膚。
開啟的增強皮膚，會在右側以一個獨立的小視窗顯示，在增強皮膚中，我們可以看到外掛提供的多項功能。
例如開啟「always on top」功能之後，它會在 Notion 的右上角增加一個「視窗置頂」的按鈕，點選按鈕就可以將 Notion 置於其他軟體視窗的上方。
此外，我們還可以更換 Notion 預設的主題，下圖是啟用「cherry cola」(櫻花可樂？？) 主題之後的效果：
每次開啟某個功能之後，它不會即刻顯示出相應的功能或效果，需要右擊右下角的 Notion 圖示，選擇「Relaunch」，重新啟動 Notion，才可以看到剛剛啟用的功能。
關於這個外掛的更多功能，這裡就不展開介紹了，留給感興趣的朋友去探索吧~
如果你覺得這個美化外掛對你有幫助的話，請不要忘了前去 GitHub 網站，給這個專案的開發者點個 Star：
你的 Star，就像是「一鍵三連」一樣，可能就是讓這個專案的開發者繼續維護下去的動力。
notion-enhancer GitHub 專案地址： github.com/notion-enha…
02. Notion Boost
之前在一篇文章中說到，Notion 不像 wolai 那樣——會在頁面的右側自動生成「懸浮目錄」，導致在 Notion 中檢視長文件並不是很方便。
後來有位朋友在留言區向我安利了一個瀏覽器外掛「Notion Boost」，它可以在網頁版的 Notion 側邊欄自動生成目錄，效果如下圖所示。
這個目錄屬於固定目錄，當你往下滑動時，它會一直固定在右側邊欄，不會因為你滑動到頁面下方，就被隱藏起來，可以說是彌補了 /table of contents 命令的不足。
這個外掛不止有生成側邊目錄的功能，還有其他額外的功能，例如像前面介紹的 Notion enhancer 外掛內建的滑動到頁面頂部的功能，一些可免費使用，有些需要付費後才能解鎖。
Notion Boost 外掛安裝地址： www.crx4chrome.com/crx/217033/
03. 將內容匯出為 Markdown
Notion 雖然支援將文件匯出為 Markdown，但自帶的匯出功能存在一個致命的問題：當匯出的文件包含較多圖片時，圖片會丟失。
之所以會想到將 Notion 文件匯出 Markdown 檔案，是考慮到未來如果自己不再使用 Notion，我存放在 Notion 的資料該如何遷移的問題。
為了解決 Notion 匯出 Markdown 圖片丟失的問題，我測試了兩種藉助第三方工具匯出 Markdown 的方法：
一種是由 @王樹義 老師寫的一個工具「Notion Markdown Exporter」，這個工具是基於 GitHub 上的一個專案「notion2md」發展而來的，不過實測已經無法使用了。
線上工具 Notion Markdown Exporter 網址： notion-to-markdown.herokuapp.com/
另外一個從 Notion 中匯出 Markdown 的方法，則需要用到一個瀏覽器外掛「簡悅」，實測匯出的 Markdown 文件還是可以接受的，解決了圖片匯出丟失的問題。
簡悅外掛支援的瀏覽器列表如下，你可以從瀏覽器的應用商店下載，也可以從官網下載外掛的 crx 安裝包。
簡悅官網： ksria.com/simpread/
使用簡悅外掛將 Notion 文件匯出為 Markdown 的流程是這樣的：開啟網頁版的 Notion 文件 → 使用簡悅外掛進入閱讀模式 → 匯出為本地 Markdown 文件。
由於 Notion 的頁面元素比較特殊，可能包含我們嵌入的各種元件，例如程式碼、視訊媒體等，直接使用外掛進入閱讀模式，會遇到內容提取失敗的問題。
因此，在使用簡悅外掛之前，需要先對外掛進行設定，新增外掛作者提供的 Notion 閱讀模式適配站點。
如何在 Notion 使用簡悅的閱讀模式： github.com/Kenshin/sim…
點選瀏覽器右上角安裝的簡悅外掛，選擇「選項」，開啟外掛的設定頁面。
切換到「站點管理」選項卡，將下面的連結貼上到頁面的「第三方適配源」中，再點選下方的「匯入到第三方適配列表」。
https://gist.github.com/Kenshin/aa3188b22f2d5dcd130610ce41cf6a7b/raw/website_list.json
複製程式碼
接著切換到「高階設定」選項卡，往下滑動頁面，找到「延遲載入列表」，在其中新增 Notion 的域名 notion.so 。
完成以上操作之後，回到網頁版的 Notion 頁面，滑鼠左鍵單擊簡悅外掛圖示，就可以進入簡悅提供的閱讀模式了。
進入閱讀模式之後，點選右下角的更多按鈕「…」，將開啟的皮膚切換到「動作」，匯出中提供了「匯出為離線 Markdown」的選項。
匯出之後，為了檢視匯出的 Markdown 文件的效果，我在 VS Code 中開啟了由簡悅匯出的 Markdown 文件，效果如下圖，圖片沒有丟失，Perfect!
以上就是本次想和你分享的內容。
看完文章如果覺得對你有幫助的話，別忘了點選底部的「點贊/在看」鼓勵一下我，謝謝。