无服务器+域名也能搭建个人博客?真的,而且很快

基于Gitee快速搭建个人博客

• 一. 背景
  • 个人搭建博客也是有成本的
  • 关于 jekyll
• 二. 部署
  • 拉取代码
  • 修改和上传配置
    • _config.yml
    • locale.yml
  • 构建和访问(gitee部署项目)
• 三. 使用
  • 上传博客
  • 上传图片
• 四. 总结

一. 背景

作为技术人, 相信大多数人都有记笔记的习惯. 记笔记的好处我就不多说了, 而且如果你觉得自己笔记记得还不错, 或许会选择将笔记发布到博客平台上去. 我们平时工作由于专业的原因, 会接触到很多平台型博客: 列如: CSDN, 博客园, 简书, 知乎, 掘金等等. 他们的优点有很多, 比如说: 功能强大, 自带图片服务器, 社交属性强, 潜在粉丝/受众多等等. 但是平台化的博客会在一定程度低个人/团队的核心竞争力. 因此很多大佬都会选择使用个人博客或者公众号来宣传个人品牌 比较好的博客有: 柒’s Blog, 好好学Java 等

个人搭建博客也是有成本的

平时我们搭建博客, 需要准备很多步骤. 大致流程为: 购买服务器->申请域名->域名审核和网站审核->选择博客系统->手动修改并部署博客系统.

其中每一步都会耗费许多的时间和精力甚至是金钱去做一些事情. 我相信很多人都不太愿意去搞这些东西的. 而最近发现的一个超级方便且简单个人博客系统——— jekyll

关于 jekyll

jekyll 是一个简单的免费的Blog生成工具，类似 WordPress. 官方网站 但是和 WordPress 不同的是，jekyll 是一个生成静态网页的工具，不需要数据库支持. 并且可以配合第三方服务, 例如 Disqus. 最关键的是 jekyll 可以免费部署在 Gitee/Github上，并且支持一件构建. 且无需我们手动申请域名

话不多说我们下面就开始使用吧~~~

二. 部署

基于 jekyll 搭建的个人博客可以部署在 Gitee/GitHub 上, 我们这里部署主要以 Gitee 为例 原因我想大家很清楚: Gitee(码云) 他快啊. 说到这里, 突然想起一句台词: 天下武功, 唯快不破. 如果之前没有申请Gitee的童鞋, 可以点击 这里 进行注册. 注册成功后, 就可以开启我们的个人博客搭建之路了

搭建步骤可以分为: 拉取代码->修改和上传配置->构建和访问. 下面我将按照该步骤去介绍如何快速搭建基于 Gitee+ jekyll 的个人博客

拉取代码

1. 仓库地址 https://gitee.com/TimePause/blog
2. 将该仓库复制一份到自己仓库 在仓库右上角, 点击fork 即可将代码复制到自己的仓库; 还有一种思路就是直接将代码下载, 修改好之后上传至自己新建的仓库, 这里我以第一种方式为例

image-20220709123438070

1. 下载自己仓库的代码 这里可以直接在命令行, 利用 git clone 自己仓库地址进行下载, 也可以通过idea/pycharm/vscode 等IDE工具来下载. 这里以IDEA的方式下载仓库代码为例: 鼠标点击 File->Close Project

image-20220709124109381

退当前出项目后选择 Get from VCS

在这里插入图片描述

将自己仓库地址复制至上面即可

image-20220708183128744

修改和上传配置

_config.yml

通过 _config.yml 来修改基础配置

1. 进入根目录下的 _config.yml

image-20220708182534247

1. 这里主要修改了以下信息, 如下图所示:
   • url : Gitee主页地址
   • baseurl: 博客所在仓库的相对地址
   • description: 博客简介
   • text_skin: 主题颜色
   • highlight_theme: 字体高亮主题

   

   在这里插入图片描述

ps:

1. url 和 baseurl 这两个参数可以通过 gitee 的管理页查看

image-20220709124927889

1. 第一次修改后, 后续再次修改 text_skin和 highlight_theme时, 需要关闭网页, 然后清理缓存, 然后刷新才能访问到.

image-20220708214716965

locale.yml

1. 修改版权时间信息 (这里如果拉取的是我的代码, 就不用改了, 因为我已经改过了~~~) 这里本地化配置有很多种语言供我们选择, 但如果我们需要显示简体中文, 那么只要关注下面的配置即可

在这里插入图片描述

顺便说一句: 这里修改的本地化配置可以在 _config.yml 来指定

image-20220709130111849

1. 提交并推送代码到指定仓库

image-20220708185429998

构建和访问(gitee部署项目)

1. 点击Gitee Pages

在这里插入图片描述

1. 身份认证 经过第1步操作之后, 我们会发现如果之前没有实名制认证, 则需要进行认证(这个才是最费时间的环节)

image-20220708185926878

填写后, 还需要上传身份证照片等相关信息

image-20220708190155215

1. 构建和部署 一般在工作日时, 审核时间大概是一天左右(周末不清楚, 可能会晚些) 审核成功之后, 再次点击 Gitee Pages, 会出现下面窗口

在这里插入图片描述

部署成功后, 点击地址即可

image-20220708190616650

点击上图超链接即可访问

image-20220709131005102

三. 使用

上传博客

1. 将 .md (markdown) 格式的文件上传至 项目根目录下 的 _post 目录下

image-20220709134159346

上传图片

1. 我们一般会在博客中上传图片, 因此我们需要将图片资源手动放到, 根目录/asserts/imgs/ 下. 图片的访问路径则是: 个人博客网站地址/图片相对目录. 例如: https://timepause.gitee.io/blog/assets/imgs/chy/20220709/image-20220709134159346.png

image-20220709135122068

ps : 关于图片的存放问题有两点要说的是

1. 我们可以以日期为目录, 然后按日期来存放. 而且这种方式因为目录层级少, 图片可以直接显示

image-20220709135233237

1. 如果是团队博客的话, 可以以自己名字+时间为目录存放图片

在这里插入图片描述

四. 总结

本文主要介绍了如何根据 Gitee+jekyll 来快速搭建个人博客. 并简单的介绍了其配置, 使用和部署方式. 其他功能欢迎大家通过官网介绍, 自己尝试哦. 如果觉得不错, 也请三连支持下哦 !