一个仅需三步配置就能生成免费个人博客的开源模板: vdoing-template

2022-07-21 17:15:40 +08:00
 eryajf

前言

模板项目地址: https://github.com/eryajf/vdoing-template

⚗️功能亮点:

🦩 以下仅需简短的几步配置,就可以配置拥有一个免费的个人博客。准备好了吗,来吧!

效果展示

首页效果图:

内部文章效果:

如果你也想要一个这种效果的博客,请往下看,只需简单几个配置步骤,即可免费拥有。

初始配置

首先访问模板仓库:vdoing-template。点击此仓库右侧的 Use this template

然后根据自己的实际情况,给仓库起名字:

这里有一个注意点:仓库的名字将会是 GitHub Pages 的访问一级路由。比如上边我仓库名字定义为:lql-notes,那么配置成功之后的首页访问路径是: https://lql95.github.io/lql-notes ,如果你想让首页的访问路径是根,那么只需把仓库名字命名为:lql95.github.io

创建完成之后,自己仓库中的项目内容如下:

然后将代码克隆到本地,使用编辑器打开:

$ git clone git@github.com:lql95/lql-notes.git

调整内容

接下来的操作就是将模板中的内容,替换成自己想要的内容,好在模板我已经精简了很多,不需要繁琐的配置,这里简单说明一下:

全局替换关键字

这样基本上就搞定了配置内容的一大步,剩下的就是一些修改美化方面的内容了。

配置首页

首页的配置信息在 docs/index.md 这个文件当中,我们可以参照官方文档进行按需配置:点我去看文档

配置评论

模板默认内置了 vssue 的评论组件,也是基于 github 的 issue 作为评论的存储数据。

只需两步即可完成配置:

现在基本配置项都已经搞定,可以将代码提交上去,然后GitHub Actions会自动将代码部署到 gh-pages 分支。

终极配置

终极配置就是等 GitHub Actions 跑完之后,我们能看到分支当中多了一个 gh-pages 分支。

此时点击 Settings ---> Pages,进行如下配置:

两个配置项,第一个表示选择哪个分支作为静态文件,第二个表示选择前边分支的哪个目录。

点击保存之后,静待一分钟,然后就可以访问上边提供的那个地址了。成果如下:

如果一路配置没问题,那么文章也应该会自动加载评论功能:

剩下的就是一些细节的优化调整,稍微打磨之后,就可以愉快地撰写你的博客了。

968 次点击
所在节点    程序员
5 条回复
eryajf
2022-07-22 08:03:12 +08:00
快来玩起来!
Kevinyy
2022-07-22 08:51:51 +08:00
楼主用的是 vuepress 2.0 实现的模版吗
eryajf
2022-07-22 10:13:20 +08:00
@Kevinyy 不是的,目前这个主题还不支持 Vuepress2.x🤗,等支持的时候,我也会同步更新。
intLee
2023-02-15 11:44:08 +08:00
不好意思挖个坟 我想把这个东西部署在本地可以吗 因为国内访问 github 还是..你懂得
eryajf
2023-02-15 22:16:35 +08:00
@intLee

可以的,你把代码拉到本地,然后运行如下两条命令:

```
yarn
yarn dev
```

然后就可以在浏览器访问了。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/867811

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX