Skip to content

1小时搭建个人专属博客详细教程(小白篇)

meswx edited this page Aug 6, 2019 · 7 revisions

声明:本篇教程参考了以下开发者的博客模板:
1、黄玄(Hux)的博客
2、柏荧(BY)的博客
3、Jekyll 开源博客框架

前言

本教程,读者无需任何编程经验,只需要按图索骥,照着做即可在1小时内搭建好自己的在线博客。

博客效果如下:

在线预览博客效果戳这里👉

教程开始

注册账号

来,小手点 这里 注册 GitHub 账号。注册完成后,先登录试下,成功后进行下面第二步操作。

第二步,fork 我的博客模板到你的仓库中:

① 复制我的仓库地址到浏览器地址栏:

https://github.com/Meswx/meswx.github.io

② 如图,点击 fork 按钮,拷贝仓库:

:这里因为我不能 fork 我自己的仓库,所以我图中是fork别人的仓库,下同。

③ 拷贝成功后,自己账号下多出类似下图的Git仓库即为成功:

配置环境

不想折腾?没事,GitHub 帮我们考虑到了,推出了可视化的软件:GitHub Desktop.

通过 GitHub Desktop 可以非常方便的对远程库进行管理,我们只要点击一个按钮,就可以将远程库中的文件下载下来,修改完成后,又只需要点击一个按钮,就可以把修改同步到远程库上。

官网下载可能会很慢很慢,在等待过程中你可以先继续通读本教程。

以mac系统为例,下面介绍下其基本使用方法:

登录

找到桌面图标,打开 GitHub Desktop ,按图所示登录上一步注册的账号:

账号在这里登录后,按软件提示,一直Continue即可。

克隆(拷贝)博客仓库

由于在上面的步骤,你的账号已经fork过我的仓库,因此打开 GitHub Desktop 后,显示如下:

你的账号下应该只有一个仓库,选中它,如下图进行克隆到本地:

本地博客仓库

耐心等待 GitHub Desktop 克隆完成,clone结束后,进入本地仓库目录,在资源文件管理器目录结构如下图:

下一步,就是把这里面的内容替换成你自己的博客内容,如:

  • 博客名称
  • 博客介绍
  • 博客文章
  • ...

这部分内容,可以参考这篇博客《利用 GitHub Pages 快速搭建个人博客》所写的。

并且大部分我已经注释过了,我就不再仔细赘述:

本地运行

当然,如果你不着急修改的话,可以先本地运行,预览下博客模板的展示效果如何:

① 请先按照 Jekyll官网中文文档指南 的指导进行 Jekyll 的安装。

② 安装成功后,即可在命令行运行博客框架:

jekyll s

③ 本地运行后,博客模板的效果如下:


👏👏👏恭喜你,到这里说明你折腾下来了,你的博客你做主😏😏😏

Clone this wiki locally