技术分享
简单搭建个人网站
00 分钟
2024-5-2
2024-6-16
type
status
date
slug
summary
tags
category
icon
password
我的个人主页已经搭建完成,点击hp.thebxcshey.top访问

😀
在我搭建了notion next的博客后,我曾尝试过使用notion+notion变网页项目制作个人主页,但这种方法并不好用,能够使用的代码生成站点寥寥无几,B站上几位up主所推荐的网站基本都无了,并且搭建后的网站无法切换深色模式,网站标题也是notion分享的标题
💡
在GitHub上,有一个名为
nextjs-notion-starter-kit
transitive-bullshitUpdated Jun 16, 2024
的项目似乎可以做到类似的效果,不过根据作者描述,这个项目还是以博客为主,并且由于notion的局限性,很难用少代码设计出好看的网站

经过我的不断寻找,终于找到了更简单的方法。这个方法有成品代码,我么们只需要修改一些内容,并且无需付费容器,cloudflare page即可部署!!!

开始搭建

首先打开这个网站
接着按照图片操作
notion image
搜索“主页”
notion image
就会出现很多结果啦
notion image
点击自己喜欢的,我以第一款为例
进入到新页面后,点击立即下载
notion image
微信和注册都可以
这个网站的源码都是免费的,只有购买附带的vps要钱,所以不需要微信注册,点击立即注册
notion image
这个东西目前没有短信验证,邮箱可以随便填
notion image
填写完就会回到原来的页面
再次点击立即下载
notion image
按图片操作
notion image
notion image
notion image
得到一个这样的压缩包(名称可能不一样,看下载的时候显示的标题)
不要解压
notion image
打开cloudflare,并按要求登录,登录可以用qq邮箱,邮箱一定要真实
notion image
这篇文章讲了如何获得免费/付费域名,以及如何托管到cloudflare
notion image
notion image
notion image
对下载的文件重命名,不要有中文
notion image
不知道怎么重命名?win11对文件右键后按F2,win10及以下右键后按M
会把win11右键菜单换成win10的肯定知道怎么重命名吧
notion image
notion image
notion image
notion image
notion image
notion image
notion image
输入自己的域名,我以我的thebxcshey.top的子域名(二级域名)hp.thebxcshey.top为例
你输入的域名必须是已经托管到cf的域名,如果是一级域名,比如xxx.com,就可以输入这个域名,也可以输入它的子域名,比如xx.xxx.com
如果是二级域名,如xxx.eu.org,就只能输入整个域名
notion image
notion image
notion image
等一会就会变成“有效”,这个网站就可以访问了
notion image
notion image
后面再进行配置修改

评论
Loading...