[Github Pages] 个人/团队主页搭建指南

前言

谁不想要拥有个人主页/团队主页呢。Homepage 有很多实现方式,从自己写 html 到搞一个 WordPress 或者就简简单单使用 Notion 搭建…总之选一个喜欢的就好。今天这个教程是利用 Github Pages 搭建免费的主页,再利用 Cloudflare 实现自定义域名(首先你得拥有一个域名)并强制 https 访问。

搭建步骤

登录 Github

人不能,也不应该没有 Github 没有的话赶紧注册一个x

创建团队账号(如果需要搭建团队主页的话推荐执行这个步骤)

登录后点击 Your organizations - New Organization - Free 选择免费团队

填写完信息即创建成功

挑选模板

Github Pages 拥有很多模板,这里给一个模板站http://jekyllthemes.org/。当然也可以从新建一个 html开始完全 diy 。这里还是推荐挑选一个自己喜欢的模板,从模板修改。

这里也推荐几个模板,还有太多太多了可以在各处找找自己喜欢的板子

  • https://github.com/academicpages/academicpages.github.io

  • https://github.com/qiubaiying/qiubaiying.github.io

  • https://github.com/Huxpro/huxpro.github.io

利用Github Actions创建主页

  • 对着喜欢的模板直接一手 Fork

例如你的团队叫做 abcd 那么仓库名字就要为 abcd.github.io

  • 开始 Build and deployment

直接 Commit 就完事

然后可以在Actions里看到网站在构建了。

绿了就表示构建完成,即可浏览器直接访问你设置的abcd.github.io

修改内容

大部分模板可能都需要markdown 以及一些 html的知识,照着对应模板的用户手册改就可以。需要clone到本地然后修改完Commit上去,修改完Actions会自动重新构建。当然极度推荐先在本地构建查看效果,等到觉得差不多了再Commit,本地的话很快就能得到修改反馈。

例如https://github.com/Huxpro/huxpro.github.io就支持本地构建。

绑定域名

拥有一个自己的域名并绑到 Cloudflare

没有域名去买一个xyz top 之类的很便宜,直接买十年大概不到200,没有Cloudflare速去注册一个。

  1. Cloudflare中添加你购买的域名

  1. 选择免费计划

  1. 找到 分配的名称服务器 复制一下

  1. 前往你的域名商的控制台,把 DNS服务器修改为Cloudflare提供的名称服务器。我是买的阿里云的域名,大的域名商都无所谓。

然后开始等待。

Github Pages添加自定义域名

注意需要先在Cloudflare中先更改SSL/TLS设置为完全及以上。

并且添加解析时似乎需要先关闭代理

然后可能需要在

这个界面多试几次 好像是有些 BUG 的,Enforce HTTPS 有时候勾选不上。我最后是删除域名后,先勾选上Enforce HTTPS然后再添加域名然后成功的… 如果有人知道为啥的话麻烦指教一下…

3 个赞

github page
经典hexo+butterfly
:yum:

有没有一些效果的链接?

我的blog:https://blog.qinyn.eu.org

好勒,很棒

很好的教程! :star_struck:
我也搭建过自己的个人主页,感觉有几点可以补充的:

  1. 域名购买。在腾讯云/阿里云购买域名应该是要备案的,如果不想走这个流程,可以去其他网站购买(如namesilo),一样地也需要修改DNS服务器,网上有很多教程。
  2. 域名解析。你可能会遇到有时候能访问但是有时候又访问不了的情况,这可能是wall()的问题,我一开始使用的是githubIO,完全没法访问,Cloudflare和Netlify我都尝试过,后者似乎坚挺一些,目前也在使用Netlify做域名解析的工作。