资讯专栏INFORMATION COLUMN

免费自建个人网站-Gridea+GitHub+Vercel傻瓜式搭建静态博客评论SSL多主题

番茄西红柿 / 4029人阅读

很多人想要搭建自己的博客网站,但是又苦于没有什么代码基础,部分同学可能觉得申请虚拟主机管理空间等操作繁琐,于是苦苦寻找那种单纯的写作平台,例如早期的新浪博客,现在的简书、国外的WP等也就成为了不少人的选择。

但是使用第三方的博客平台有一个最大的问题:不稳定。可能有的人会说大厂商不怕倒闭,纵观互联网这十几年的发展,再大的大牌服务如果没有赢利支撑,该倒闭的倒闭,该关停的关停。用户的利益对于商家来说不是高于一切。

本篇文章就来分享一个利用静态博客生成器Gridea来发布自己的博客网站,你可以将它发布任何支持Web访问的空间,这里我们以Vercel提供的免费空间来作为我们的静态博客文件发布平台,Vercel支持绑定域名,且提供免费SSL证书,是我们的理想建站平台。

免费自建个人网站-Gridea+GitHub+Vercel傻瓜式搭建静态博客评论SSL多主题

更多的建站免费资源,这里还有:

  1. 免费域名.tk,.ml,.ga,.cf,.gq申请注册和DNS解析-绑定免费空间教程
  2. 微软Azure免费VPS主机申请与使用-香港,日本,韩国,美国等机房VPS主机可选
  3. Oracle Cloud甲骨文免费VPS主机申请使用-日本,韩国和美国等免费云VPS主机

PS:更新记录.

1、想找免费VPS主机的朋友,可以看看:GCP VPS主机性能与速度评测-免费试用90天有香港韩国等多个机房性能出众。2021.5.18

2、微软的免费VPS主机可以免费使用一年,参考:微软Azure免费VPS主机申请与使用-香港,日本,韩国,美国等机房VPS主机可选。2021.5.18

一、GitHub创建仓库

网站:

  1. https://github.com/settings/tokens
  2. 演示:https://gmm.wzfou.net/

1.1 新建API

进入到GitHub的API获取页面,点击创建新的Token。

GitHub创建api

在创建Tokens时,名字可随意,只需勾选repo相关权限即可。

GitHub授权

1.2 新建仓库

在GitHub新建仓库。

GitHub新建仓库

给你的博客项目命名。

GitHub设置

二、Gridea生成网站

网站:

  1. https://gridea.dev/

2.1 配置软件

进入到Gridea,下载安装。启动软件,点击远程设置,这里填写你的域名、仓库名称、分支为main、用户名为你的Github用户名、令牌就是你刚刚获取的Token。如下图:(点击放大)

Gridea远程设置

2.2 开启评论

Gridea支持开启Gitalk、Disqus评论,如果要开启Gitalk评论你需要先开启授权。首先,您需要选择一个公共github存储库(已存在或创建一个新的github存储库)用于存储评论。

Gridea开启评论

然后需要创建 GitHub Application,如果没有 点击这里申请:https://github.com/settings/applications/newAuthorization callback URL 填写当前使用插件页面的域名。

Gridea申请授权应用

最后,你就可以在评论设置中ID和密钥了,如果Gitalk 提示 Error: Not Found,点击 GitHub 登录会返回首页。这是因为 GitHub OAuth Application 中的 Homepage URL 和 Authoration callback URL 有误,若是有自定义域名需填写自定义域名。

Gridea显示评论

2.3 同步文件

点击Gridea的同步,就可以将刚刚我们设置的网站同步到GitHub仓库了。

Gridea同步文件

打开你的Github项目的main分支就可以看到你同步过来的文件了。

Gridea查看项目

三、Vercel发布网站

网站:

  1. https://vercel.com/

其实Github Page就是一个免费的静态空间,但是Vercel相对于来更加有优势,一是速度更快,在亚太有节点,国内访问速度快;二是可以绑定自己的域名;三是支持自动为绑定域名生成Lets免费证书,支持Https访问。

Vercel登录

直接在Vercel使用Github账号登录,然后选择导入你的Git,就是你刚刚创建的项目。

Vercel选择项目

选择你的账号。

Vercel选择账号

确认你的项目。

Vercel导入项目

确认导入。

Vercel确定导入

最后就是将你的Github代码部署到Vercel了。

Vercel部署代码

打开你的Vercel二级域名你就可以看到你的博客部署成功了。

Vercel部署网站成功

四、绑域名开启SSL

本部署是可选项,对于没有自己的域名使用上面的Vercel二级域名建站也是可以的,不过购买一个域名现在已经也是白菜价了,像腾讯云阿里云等一个域名也就是十几块钱。

在Vercel中点击设置,然后选择绑定域名,输入你自己的域名。

Vercel绑定域名

此时,Vercel会生成一个CNAME记录。

Vercel生成CNAME

到你的域名DNS解析处,给你的域名添加CNAME记录。一般来是www和@,这里我以gmm来测试的。

Vercel添加解析

待域名解析生效后,你就可以使用你的域名来访问Vercel空间了。

Vercel设置成功

五、自定义博客主题

网站:

  1. https://gridea.dev/themes

本部署是可选项,Gridea提供的四个默认的主题其实已经可以满足大多数人的写作需要了,当然为了好看你也可以选择一些网友制作的主题。(点击放大)

Vercel主题

点击 Gridea 左侧「系统」菜单,查看源文件夹目录,进入目录,然后将主题文件夹放入 themes 文件夹,重启应用即可。

Vercel找到源文件

将下载的主题文件放在这里。

Vercel存放主题

Gridea 有些主题提供的非常多的设置选择,比如设置背景图片、音乐、访问统计、SEO等等。

Vercel多个选项设置

这些你都是根据你自己的需要来选择。

Vercel自定义设置

六、Gridea撰写博客文章

完成上面的所有配置后,你现在就可以开始使用Gridea撰写博客文章了。

Vercel撰写文章

Gridea撰写文章还是比较简洁的,添加表情、添加图片、设置分隔符等。

Vercel插入图片

Gridea支持直接在线预览,撰写之后点击预览就可以看到效果。

Vercel预览页面

没有问题的话,点击同步一下就行了。

Gridea同步完成

七、Gridea同步与备份

如何你想要在其它的电脑上撰写博客文章怎么办?你仅将博客源文件夹(默认是 ~/Documents/Gridea)通过OneDrive 、坚果云或其他类似网盘同步工具进行文件备份与同步,然后在别的电脑上替换一下Gridea的博客源文件即可。

  1. 巧用又拍云FTP和坚果云WebDAV-打造个人文件备份和数据云存储
  2. 本地网络磁盘RaiDrive挂载Dropbox,Google Drive,OneDrive支持WebDAV,FTP,SFTP
Gridea同步备份

如何一起同步自己的静态文件?手动复制文件到博客源文件夹的 static 文件夹,构建时会直接复制到 output 文件夹。更多关于数据同步备份请参考:网盘存储

八、总结

Gridea真的是一个非常好用的撰写博客程序,本篇文章是将静态博客文件同步到Vercel免费空间上,实际上Gridea可以通过SFTP等方式将博客网站发布到任意一个支持Web访问的平台上,这样你的博客就永远不会丢了。

文章出自:挖站否 https://wzfou.com/gridea-blog/,版权所有。本站文章除注明出处外,皆为作者原创文章,可自由引用,但请注明来源。


文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/117854.html

相关文章

  • EMBY自建个人影音播放系统-使用免费开源Emby打造个人影视媒体库

    摘要:服务器端支持,客户端支持网页,和等移动操作系统。同样支持和等流媒体设备,智能电视和三星智能电视等智能电视,以及和等游戏机。自带了非常多的插件,它可以帮助你搭建一个自己的影视媒体库,实现在线播放与观看视频。Emby(原名Media Browser)是一个主从式架构的媒体服务器软件,可以用来整理服务器上的视频和音频,并将音频和视频流式传输到客户端设备。Emby服务器端支持Microsoft Wi...

    番茄西红柿 评论0 收藏2637
  • 挖站否免费PHP空间申请与使用-2G空间20GB流量电信CN2 GIA线路DA面板

    前段时间主服务器被攻击的影响,导致挖站否免费PHP空间运行不稳定,这一段时间一直处理备份和数据恢复的事情。同时,由于WHMCS的成本问题,最终决定将原来的免费PHP空间转入到挖站否后台共同管理,故写了这篇挖站否免费PHP空间申请与使用教程。挖站否免费空间从2018年开始提供(挖站否免费空间申请与使用),线路从原来的普通线路升级到CN2一直到现在的电信CN2 GIA,空间后台由Cpanel到后来的D...

    番茄西红柿 评论0 收藏2638
  • 收集整理适用博客建站免费开源Wordpress主题-简约好看的WP主题

    摘要:最重要的就是找一个适合自己的主题了。事实上,免费主题也非常多,而且很多的免费主题在功能上和界面美观上已经大大超过了付费的主题。加上这些主题都是开源的,基本上可以在上找得到源码,安全性是没有问题,主题的作者也在不断更新当中。WordPress最重要的就是找一个适合自己的主题了。好一点的WordPress主题基本上都是要收费的,而且价格还不便宜,这导致了不少的新手朋友们很为难。而有时我们仅仅根据...

    番茄西红柿 评论0 收藏2637
  • 使用 Gatsby.js 搭建静态博客 6 评论系统

    摘要:原文链接方案选择大家都知道等第三方评论系统的存在。部署自己的的原理就是使用接口把评论更新到你静态博客的仓库,触发博客重新部署,在页面生成评论。这样得到的博客页面包括评论部分都是完全静态的。配置完毕推送到或本地运行。 原文链接:https://ssshooter.com/2019-01... 方案选择 大家都知道 disqus 等第三方评论系统的存在。disqus 几年前还是挺好使的,但...

    venmos 评论0 收藏0
  • 技术存档:建站(一)

    摘要:自建主要花费在购买云服务器上和静态资源托管上,剩余工作一力承担。 写这系列文章的初衷是:对自己知识面广度和深度的确定,并以此调整后续的发展和学习方向。希望能达到温故而知新的效果。 选择从建站入手,是因为这个是最常见的要求。对于公司而言,网站是展示公司主旨、业务、沟通方式、宣传营销的必选方案,一个符合公司形象的高质量官网,必然能让客户留下良好的第一印象。,对个人而言,博客是表达其特有的思...

    chnmagnus 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<