如何创建github博客(全网资料整理+细节版)

本博主从0开始做成的这个博客的所有技术资料都在这里,具体来说:

  • 从0开始,搭建博客平台
  • 如何管理博客,怎么写博客
  • 增加博客的其他功能(如绑定域名,增加评论区,微信转载等)

好啦,接下就开始建立你的博客吧~

写在前面: 博主各种查,终于在不到1天的时间内建好博客。因为网上资料太散了,所以我算是汇总网上的全部资料做成的这个资料集,希望其他人看了之后可以帮助你们尽快实现拥有一个自己的博客的梦想

从0开始,搭建博客平台

什么叫从0开始,就是你至少有台能上网的电脑,其他什么都没有都行。

现在你们看到的就是我建好博客之后的样子:

博客界面

当然,手机端也是可以看到的。

我建博客站点参考的是傻瓜都可以利用github pages建博客,就喜欢这种无脑的。

除此之外还有用hexo的Github+Hexo+NEXT主题+域名绑定 博客搭建全记录

hexo是一个静态博客框架,如果用这个可以不用提交到github之后等,基本上修改后直接localhost就能看到修改内容,我是觉得麻烦,我用的第一个。

这篇博客的主题是NextT主题,我发现这个主题确实好看,并且现在用的很顺手。

如果你跟着第一(推荐)个或者第二个教程做完了,那么你现在就有了一个叫username.github.io的博客了,当然username是你自己的名字,比如我这个就是atlasbioinfo.github.io

除此之外,为了管理方便,推荐大家下载github桌面客户端

github下载界面

其他参考资料:

  1. HEXO搭建个人博客
  2. jekyll中文说明文档
  3. 极客学院jekyll教程
  4. jekyll主题

好啦,你的博客搭好了吗?

开始写博客

现在,熟悉了markdown语法之后,我现在正在用vim写这个博客

经历了上一步的朋友们肯定略纠结的是,到底怎么写啊?

因为我们写博客一般比较熟悉的是使用某个编辑器,上面有可以点的加粗啊,斜体啊,插入图片什么的,但是github博客是不一样的,木有自带编辑器,你需要用纯文本的方式去写,纯文本大概类似你在记事本这种软件里面写博客。刚开始会很痛苦,不习惯,但是熟悉之后你就会体会到这种纯文本编辑的乐趣了,比如我现在。

初识Markdown

你的github仓库的目录中有一个文件夹名字是_posts,那个里面那些.md的文件就是你的博客。你可以用你喜欢的IDE打开,或者记事本、notepad++,打开这些文件。

创建博客分为以下几步:

md文件的命名

#必须这样命名,要不就无法显示你的博客
#md就是markdown的缩写,这里如果是高手还可以用其他标记语言
年-月-日-博客标题.md

#示例,月和日的0必须加上,也就是必须2位
2017-09-09-如何创建github博客.md

#博客名为英文的话把空格换成-
2017-07-20-next-tutorial.md

#上面的博客标题只是在列表中显示的标题,与打开博客之后出现的标题无关

按照上面的命名规则就可以建立一个你自己的博客,比如2027-09-09-我的十年后的博客.md

头信息

下面是在示例文件next tutorial中的头信息

---
title: Next Theme Tutorial
description: NexT is a high quality elegant Jekyll theme ported from Hexo Next. It is crafted from scratch, with love.
categories:
 - tutorial
tags:
---

每个博客必须有头信息

2排三个‘-’就是标记符号,中间的就是头信息,就算中间什么都不写都行(最好写上,要不博客都是未命名)

title就是标题 description是描述 tags是标签,或者说关键词 categories是分类

其他头信息请参考jekyll头信息

用markdown语法写博客

markdown是一种标记语法,可以用文本的方式表示段落,加粗,斜体,编号,高亮等方式。

刚开始不熟悉可以采用一些在线生成的markdown编辑器,比如Dillinger,或者我之前使用的cmd markdown——作业部落出品,似乎有道云笔记也可支持markdown编辑器,偶然看到了。

作业部落编辑器

在线编辑器主要所见即所得,所以上手的会比较快

个人经验,在线编辑器仅用于入门,也没必要花大把的时间在选择什么编辑器上,熟悉之后用IDE写感觉更高大上,我还用过的IDE有Adobe Edge Code CC等

入门可以用上面的任意一个在线编辑器,配合下面的参考资料,知道怎么弄标题,怎么引用段落,怎么高亮,怎么插入图片等等。这些语法都很简单,两下就熟悉了。

还有搭好博客会有很多示例博客,里面会介绍很多,比如怎么插入图片,怎么高亮的代码,直接套用就行。

参考资料:markdown入门

一些基本的markdown索引

#插入链接(如果链接是个文件就是下载了)
[显示的名字](https://链接)

#插入图片
![图片名](https://图片链接.jpg)

#标题

##一级标题

###二级标题

###三级标题

**加粗**

*斜体*

#表格

|表头1|表头1|表头3|
|:***:|:***|***:|    分别是居中,左对齐,右对齐,星号数量无所谓
|内容1|内容2|内容3|

其他请参考markdown入门

管理你的博客

管理无非是增删分类,对于用github写博客非常的不幸,你没有一个类似CSDN或者简书那种现成的分类系统和编辑系统,不过就算没有这些管理起来也很容易。

增删博客

就是在posts文件夹下新建一个md文件就行,之后写头信息,头信息参考上文。

删除那更简单,直接在_posts文件夹中删除博客就好。

博客分类

头信息中添加这样的语段:

categories:
 - 测试类

后面那个名字自己起就行,这样在网站重新编译的时候就会出现你这个分类

博客首页分页

首页分页比较简单,直接改_config.yml中的语句就行

paginate: 3
paginate_path: "/page:num/"

3就是每页显示3个元素

之后归档和分类又有具体的分类语句块,解注释就好

增加博客的其他功能

把图片放入图床

上文曾经讲过插入图片的方式,但是为什么要放入图床,图床是什么鬼?

图床就是保存图片的网盘,我理解的,优点就是用户访问的时候比较快,加载的快。如果你把图片放到自己的github某个文件夹里,如果在载入页面的时候就会非常慢。而不用外链(比如你从百度图片搜到一个,复制他的链接)是因为这样不稳定,万一那个网站挂了,或者他把图片删了,你的博客里面就一片空白了。

现在图床挺多,参考如何使用七牛云做为图床?,用七牛云储存,顺便当图床。

增加表情Emoji

有些版本的jekyll主题或者什么的自带表情,但是我用的(估计也是大多的)jekyll没有表情Emoji的。

我看到主题的配置文件(_config.yml)里面有这样的注释:

# Plugins
## Docs: https://help.github.com/articles/configuring-jekyll-plugins/
plugins:
# jemoji conficts with toc in some no-ascii post
# - jemoji
 - jekyll-sitemap
 - jekyll-feed
 
  1. 所以首先去掉这个注释,保存上传。

  2. 之后在自己的目录中增加_plugins文件夹

  3. 下载Jemoji.rb这个文件放在_plugins文件夹中,可以直接clone

OK

关于在github pages加入各种插件,以及github支持的插件列表在:Adding Jekyll plugins to a GitHub Pages site官方说明,里面有目前支持的所有插件github pages支持的所有插件及版本列表,其中jemoji支持0.8.0,jemoji各个版本下载列表。按理说这个需要gem安装,博主图省事直接把jemoji.rb这个文件下载下来,放在上面的文件夹中。

这里符号比较多,比较难记,大家可以参考github Emoji表情符号对照表,点击就可以复制,很方便。

哎,有一点好纠结,插入表情之后右边的目录就会乱码,天-_-,有没有谁会戒解决这个,求告知。

绑定自己的域名

这条针对有或者享有自己域名的用户,也就是如果你不喜欢username.github.io这样的域名,想有一个自己的.com或者.net这种域名

如果没有域名从下文1开始看

如果已经有域名从下文3开始看

  1. 首先,选一个没被注册过的网址

    如果你还没有,想要一个自己的域名,那就去申请吧。中国申请域名大多在中国万网,归阿里旗下

    网址: https://wanwang.aliyun.com/

    首页就可以搜索自己想要的域名,名称自己想,选择好后按照阿里云购买流程买完,接下来他会提示你进行备案过程。

    beian

  2. 备案

    备案挺方便的其实,不过时间就是久一点,1个月似乎,已经备案好久了。

    总之就是,你先上传电子资料,之后需要到所在地指定地点拍照确认。

    个人建议,你先用github.io的域名搭好博客,写了一段时间觉得自己可以坚持下去或者有必要申请域名的时候这时候再申请域名也不迟。

  3. 增加解析和自己的github博客绑定

    登陆自己购买域名的那个网站,比如万网,阿里云。其中就有域名解析,添加3条解析规则:

    记录类型 主机规则 记录值
    A @ IP1
    A @ IP2
    CNAME www username.github.io

    记录类型,主机规则是什么意思自己查

    IP1是你打开cmd,输入 ping github.io 出现的ip,也就是github.io的服务器IP

    IP2是你打开cmd,输入 username.github.io 出现的ip,也就是username.github.io的服务器IP

    username换成你自己的github域名的名字

    网上查的说法不一,理论上只要一个就行。

    这样就大功告成了

常见问题FAQ

为什么修改了博客或者配置文件之后网站上并没有变

根据个人经验,博客内容修改之后,关闭曾经打开的页面,再次进入你的博客,就可以显示。如果不关闭曾经的页面,因为浏览器已经下载了数据,所以你刷新之会显示曾经的数据,而不是你修改后的。

如果是博客名改变,新增博客等,似乎等的时间会长一点,1min差不多吧。

如果改变的是jekyll的配置文件里的东西(比如网站名,加载方式等),似乎等的时间会更长,应该是github需要重新把这个做成静态的吧。总之你改好了就需要等一等的,除非你自己在自己的电脑上搭个服务器测试,那肯定瞬间就出现。

欢迎大家关注我的网站:atlasbioinfo.com

转载请注明出处,您的支持将鼓励我继续创作!