使用Notion和Nobelium搭建博客网站

点击下方公众号卡片，回复关键字：模板 即可获取Notion模板大全。

# Nobelium简介

• 快速：快速的页面渲染和响应式设计，高效编译器的快速静态页面生成。
• 多设备支持：在桌面端、移动端一样完美显示。
• 自动高效免费：部署在免费且快速的Vercel平台，在Notion上的更新自动同步到网页上。
• 功能全面：支持评论、宽页面、搜索、标签、订阅、网站统计、黑暗模式等等。
• 美观优雅：使用Tailwind CSS，二次开发容易，自定义性高，可配置项多，支持多语言（包括简体中文）。

# 开始部署

搭建Notion数据库

搭建GitHub仓库

const BLOG = {  title: '核桃Blog',  author: '吃核桃不吐核桃壳',  email: 'zdh883210zdh@gmail.com',  link: 'https://blog-rouge-five.vercel.app/',  description: '为你，千千万万次',  lang: 'zh-CN', // ['en-US', 'zh-CN', 'zh-HK', 'zh-TW', 'ja-JP', 'es-ES']  appearance: 'auto', // ['light', 'dark', 'auto'],  font: 'sans-serif', // ['sans-serif', 'serif']  lightBackground: '#ffffff', // use hex value, don't forget '#' e.g #fffefc  darkBackground: '#18181B', // use hex value, don't forget '#'  path: '', // leave this empty unless you want to deploy Nobelium in a folder  since: 2021, // If leave this empty, current year will be used.  postsPerPage: 7,  sortByDate: false,  showAbout: true,  showArchive: true,  autoCollapsedNavBar: false, // The automatically collapsed navigation bar  ogImageGenerateURL: 'https://og-image-craigary.vercel.app', // The link to generate OG image, don't end with a slash  socialLink: 'https://twitter.com/craigaryhart',  seo: {    keywords: ['Blog', 'Website', 'Notion'],    googleSiteVerification: '' // Remove the value or replace it with your own google site verification code  },  notionPageId: process.env.NOTION_PAGE_ID, // DO NOT CHANGE THIS！！！  notionAccessToken: process.env.NOTION_ACCESS_TOKEN, // Useful if you prefer not to make your database public  analytics: {    provider: '', // Currently we support Google Analytics and Ackee, please fill with 'ga' or 'ackee', leave it empty to disable it.    ackeeConfig: {      tracker: '', // e.g 'https://ackee.craigary.net/tracker.js'      dataAckeeServer: '', // e.g https://ackee.craigary.net , don't end with a slash      domainId: '' // e.g '0e2257a8-54d4-4847-91a1-0311ea48cc7b'    },    gaConfig: {      measurementId: '' // e.g: G-XXXXXXXXXX    }  },  comment: {    // support provider: gitalk, utterances, cusdis    provider: '', // leave it empty if you don't need any comment plugin    gitalkConfig: {      repo: '', // The repository of store comments      owner: '',      admin: [],      clientID: '',      clientSecret: '',      distractionFreeMode: false    },    utterancesConfig: {      repo: ''    },    cusdisConfig: {      appId: '', // data-app-id      host: 'https://cusdis.com', // data-host, change this if you're using self-hosted version      scriptSrc: 'https://cusdis.com/js/cusdis.es.js' // change this if you're using self-hosted version    }  },  isProd: process.env.VERCEL_ENV === 'production' // distinguish between development and production environment (ref: https://vercel.com/docs/environment-variables#system-environment-variables)}// export default BLOGmodule.exports = BLOG

部署到Vercel

# 开始写博客吧

# 功能拓展

评论系统

cusdisConfig: {  appId: '在这里填进你的data-app-id', // data-app-id  host: 'https://cusdis.com', // data-host, change this if you're using self-hosted version  scriptSrc: 'https://cusdis.com/js/cusdis.es.js' // change this if you're using self-hosted version}

# 总结

虽然个人博客在当代互联网中不一定是最好的内容载体，但重点永远在于内容创作。通过Notion和Nobelium，我们可以更专注于内容创作，享受书写和分享的乐趣。这条创作之路或许漫长，但坚持下去，就能守住自己的一片天地，也是一种浪漫的坚持。希望大家也能通过这个教程，搭建出属于自己的博客网站，记录和分享自己的点滴感悟。

热门推荐

• Notion 实战指南：打造你的生产力引擎
  
• 快速教你利用Notion制作任务强提醒
  
• 用Notion API和Next.js创建联系表单