<aside> 🔗 Demo | GitHub | 作者主页

</aside>

🏋️‍♂️ 项目特性

Fruition 是开发者 Stephen Ou 制作的一段开源的代码，将该代码部署在 Cloudflare Workers 上，就可以将 Notion 的公开页面发布为普通网页。

🛠 新版 worker 代码及修改步骤

几个月前 Notion 将公开页面的分享域名从 .so 更改为 .site，导致使用旧版 Fruition 代码时会出现 Mismatch between origin and base URL (dev) 的错误。目前，demo 网站上的代码生成器可能不是最新版本，因而仍有部分朋友遇到报错的问题。推荐直接使用 GitHub 里的 worker.js 中的新版代码来部署，以下为地址和修改步骤说明。

fruitionsite/worker.js at master · stephenou/fruitionsite

  1. （重要）输入域名
  2. （重要）第一行必填 Notion 主页面 ID，后几行选填自定义别名和对应 Notion 页面 ID
  3. （推荐）为 SEO 添加站点名称和描述
  4. （选填）添加 Google Font 字体名
  5. （选填）添加其他脚本
/* CONFIGURATION STARTS HERE */

/* Step 1: enter your domain name like fruitionsite.com */
const MY_DOMAIN = "fruitionsite.com";

/*
 * Step 2: enter your URL slug to page ID mapping
 * The key on the left is the slug (without the slash)
 * The value on the right is the Notion page ID
 */
const SLUG_TO_PAGE = {
  "": "771ef38657244c27b9389734a9cbff44",
  thanks: "9d9864f5338b47b0a7f42e0f0e2bbf46",
  showcase: "92053970e5084019ac096d2df7e7f440",
  roadmap: "7d4b21bfb4534364972e8bf9f68c2c36"
};

/* Step 3: enter your page title and description for SEO purposes */
const PAGE_TITLE = "Fruition";
const PAGE_DESCRIPTION =
  "Free, Open Source Toolkit For Customizing Your Notion Page";

/* Step 4: enter a Google Font name, you can choose from <https://fonts.google.com> */
const GOOGLE_FONT = "Rubik";

/* Step 5: enter any custom scripts you'd like */
const CUSTOM_SCRIPT = ``;

/* CONFIGURATION ENDS HERE */