0%

如何利用Matataki和Github搭建个人博客,永久保存数据?

1:目标

首先最重要的事情是:数据安全。

其次才是访问的情况:速度流畅。

2:基础

我们需要哪些基础?

  • 尽量用最简单的话语来描述问题所在。
  • 用常见的方法解决问题。

你可以看前面的内容,也可以不看:

为什么要创建博客来保存数据?

本篇教程将重新注册账号,来讲解在过程中会遇到的问题,以及一些解决的方法。

3:开始

1:我们需要一个githubi账号:

https://github.com/

img

我们需要准备一个邮箱账号,这个就不用多说了。

本次使用使用的邮箱账号为:xs@btcabc.cn

img

我们继续下一步操作。

img

创建密码,密码要求至少8位字符,包括数字和小写字母。

img

输入用户名,下面显示为用户名可用即可。

img

接受产品的更新公告,输入y。

img

恶心的验证码出来了。

我们再点击创建。

img

邮件认证,我们去邮箱找到GitHub发来的邮箱。

可用使用浏览器记住密码。

貌似收不到,我们更换其他的邮箱试试看:

btcabc@vip.qq.com

img

选择上面框框的部分其中一个点击即可。

img

出现这个就代表你的邮箱已经认证成功。

img

你也可以前往个人页面去查看,邮箱已经认证了。

(这时候你的GitHub账号地址就是:https://github.com/keyxec)

img

2:我们需要一个matataki账号:

https://www.matataki.io/

img

我们点击注册去注册一个账号:

img

我们去邮箱查看验证码:

img

然后填入验证码,注册成功。

img

我们登陆后,选择头像,我的账户。

img

你可以修改一下昵称(后面可以反复修改)。

img

下滑到最下方,点击验证码,保存即可。

img

选择独立子站,推荐打开教程指南,一边观看一边操作。

前面先去账号管理,里面绑定github账号再来操作。

img

我们去绑定账号。

img

如果你没有退出GitHub账号,那么可以直接授权。

img

看,绑定成功了。

img

再回到独立子站,我们就可以创建仓库了。

仓库的名称建议自己取一个可以理解的单词,或者好记的。

比如,我输入key:

img

完成验证码并且创建。

img

这里点击前往页面设置,其实并没有开启独立子站的网页浏览服务,我们需要手动打开它。

我们回到GitHub去看看,就会发现多了一个名叫key的仓库。

img

我们打开它。

img

参考地址:

https://github.com/keyxec/key/settings/pages

(将对应的账号和仓库换成你自己的即可)

img

我们选择None,然后再选择main,最后再点击Save确认。

img

我们就拥有了一个子站的浏览地址:

https://keyxec.github.io/key/

现在还无法打开,因为我们需要上传一篇文章,才可以显示内容。

我们回到独立子站,看看是否已经同步开通成功。

img

我们的matataki已经成功了,那么我们如何使用他呢?

3:发布第一篇存储在GitHub独立子站的文章

我们点击右上角,发文章,进入发文页面。

img

当然,我们也可以一键导入其他平台的文章,但是我推荐手动复制过来。

img

因为导入文章只是懒人的做法,而且文章的源文件还是在被导入的平台。

img

我们就暂时写一个这么简单的两句话。

然后点击发布,进入发布页面,你可以选择一些可选项。

包括封面图片,标签,关联FAN票,授权许可协议等多项内容。

img

但是这不是最重要的,最重要的在最下面,文章的存储位置,你可以选择GitHub了。

原来只能保存在IPFS上面,选择可以选择保存到独立子站。(两者只能选其一)

img

你可以把文章的标签也同步过去。

当你发布成功后,存储位置会变成独立子站

img

上面的两个都可以打开你的存储地址,我们选择在独立子站阅读本文

img

他会出现一个老式博客的界面,我相信这种你是不会喜欢的。

(下面是相关的数据说明示范图)

img

那么,如何换皮肤呢?

我们重新回到独立子站,来修改一些内容。

标题,作者,语言(简体),时区(东八区),主提(这就是皮肤了)。

img

我们选择其他的看一下,究竟如何?

img

他会向你确认,因为有的主题的确会有各种不兼容的问题,所以开始就选择一个好看的主题比较好。

img

这种就明显好看多了。

在测试完这几种皮肤后,我选择了stellar的主题,因为他太简洁了,比较适合我。

(如果大家有兴趣可以去全部测试一下,我就不再本文演示了)。

img

我们看看选择了之后的页面是怎么样的:

img

现在貌似会自动添加随机封面,当然后面会告诉你怎么样添加固定封面。

浅白色,淡雅,比较适合我。

更多的换皮教程,参考文章:

想要自己切换独立子站的主题

4:进阶教程

1:如果修改界面?

我们可以找到这种图片,来自AndoAlpha。

img

但是这里却没有修改公告栏的内容,我想自定义公告栏,这是合理的请求。

于是,我找到了stellar的热门教程。

https://xaoxuu.com/wiki/stellar

非常感谢这位名叫xaoxuu的用户提供的教程。

推荐大家去看一下,虽然有的命令不兼容,但是绝大部分是有帮助的。

其他的主题修改方式也可以去查看一些热门的教程。

自定义头像

img

开始就可以自定义头像,只要可以定义头像,肯定是需要来一个的。

我们打开:https://github.com/keyxec/key

选择source(应该是默认的)。

img

我们打开**_config.yml**文件,然后选择右边的小铅笔修改内容。

img

我们添加一行,随便选择一行,为了醒目我就写在第二行了。

avatar: 您的头像链接

(暂时就先随便找一个图片示范一下,如何获取连接)

img

审查元素,获取图片地址。

或者,鼠标右键,复制图片地址。

img

然后我们滑到下面,选择Commit changes更新文件:

img

文件更新需要稍等片刻才可以去查看网页内容。

img

可能是这个图片链接不怎么样,我们换一个图片链接来尝试一下。

找到一些免费的图床。

https://imgurl.org/

img

我们这样就获得了图片的链接。

我们再重复上面的操作即可,稍后刷新网页就成功了。

img

自定义状态栏

引用我自己的内容:

img

我们再创建这个文件:

source/_data**/**widgets.yml

img

我们直接复制内容:

welcome:

​ layout: markdown

​ title: 欢迎欢迎

​ content:

​ - ‘欢迎光临KEY小站,这是公告栏。 ‘

把上面的公告修改成为自己的即可。

img

最后还是滑到最下面,点击绿色的按钮保存。

img

如上图所示,已经修改成功了。

但是我还是觉得少了什么,于是又开始了复制大法。

自定义导航栏

因为缺少导航栏呀,原来如此。

img

这是官方的解读内容。

我们来修改这个文件内容。(如果没有就创建)

img

我们保存,来看一下效果如何?

刚才有一个错误,就是不要添加blog。

img

等下我们再看一下。

img

2:在GitHub直接发布文章内容。

我们的文章是保存在key/source/_posts这个文件夹下面的。

img

我们可以修改文件的标题,不影响显示的结果。

出于一个好的习惯,我推荐你创建相关的目录(如上图的2021/7/)来保存对应的文本。

img

我们选择更新文件来发布内容。

img

如果想添加标题,只需要加上一行 title: 标题 即可。

模式如下所示:

img

我们再来创建一篇看看。

img

我们来看一下,第一行和第六行是相关的符号。

title:标题

data:时间

tags:标签

img

你也可以添加更多的内容,在后面会讲解的。

本文暂时到这里,后续再更新其他的操作。

目前的本文测试小站:https://keyxec.github.io/key/