在github上搭建免费的博客
github好多年前,大家都开始玩啦,我这个菜鸟近几年才开始。github不仅可以管理项目,还可以搭建博客。技术人员,一般用的博客为博客园,CSDN多一些。看到朋友们都弄一个,我也开始弄起来,先找点资料看看,然后开始动手了。
我的电脑是MAC的,其他系统也差不多。先看看我建博客的过程,已经成功了,而且很好用,大家可以看看我的网址https://lu-yuan.github.io .
(1)首先在github上注册账号,可以使用github,https://github.com/join?source=header-home
这个比较简单,填写用户名,邮箱,密码等就可以了。如果有账号了,我们接着看下面。
(2)搭建github博客,需要用的东西,github page, jekyll模板。
首先打开https://pages.github.com/,按照步骤一步一步来,
第一步,先建一个项目仓库,名称很重要,要和用户名一致。

第二步,github客户端下载,超好用的,下载客户端,

客户端装成了,
第三步,创建index.html
<!DOCTYPE html>
<html>
<body>
<h1>Hello World</h1>
<p>I'm hosted with GitHub Pages.</p>
</body>
</html>
第四步,先选中change部分,然后commit, 再然后sync

第五步,提交成功,浏览页面,https://username.github.io 记得username换成你的用户名
github pages完成了,接着jekyll模板部分。
jekyll是静态站点生成器。根据网页源码生成静态文件。提供了模板,变量,插件等功能,用来编写整个网站
第一步,创建项目,
在本地先建个文件夹,blog.
$ mkdir jekyll_demo
对该目录进行git初始化
$ cd blog
$ git init
然后,创建一个没有父节点的分支gh-pages。因为github规定,只有该分支中的页面,才会生成网页文件。
$ git checkout --orphan gh-pages
第二步,创建设置文件
在根目录下,创建一个名为_config.yml的文本文件。是jekyll的设置文件,我们在里面填入如下内容,其他设置都可以用默认选项,具体解释参见官方网页
baseurl: /blog
现在目录结构变成:
/blog
|-- _config.yml
第三步,创建模板文件,
在根目录下,创建一个_layouts目录,用于存放模板文件,
$ mkdir _layouts
进入该目录,创建一个default.html文件,作为Blog的默认模板。并在该文件中填入以下内容
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>{{ page.title }}</title>
</head>
<body>
{{ content }}
</body>
</html>
Jekyll使用Liquid模板语言,{{ page.title }}表示文章标题,{{ content }}表示文章内容,更多模板变量请参考官方文档
现在目录变为
/blog
|-- _config.yml
|-- _layouts
| |-- default.html
第四步,创建文章
在根目录,创建名为_posts目录,作为blog的文章。
$ mkdir _posts
进入该目录,创建第一篇文章,名为2017-04-19-hello-world.html
在该文件中,填入如下内容,注意行首不能为空格,
---
layout: default
title: 你好,世界
---
<h2>{{ page.title }}</h2>
<p>我的第一篇文章</p>
<p>{{ page.date | date_to_string }}</p>
每篇文章的头部,必须有一个yaml文件头,用来设置一些元数据。它用三根短划线"---",标记开始和结束,里面每一行设置一种元数据.
"layout:default",表示该文章的模板使用_layouts目录下的default.html文件;"title: 你好,世界",表示该文章的标题是"你好,世界".
现在目录结构变成:
/blog
|-- _config.yml
|-- _layouts
| |-- default.html
|-- _posts
| |-- 2012-08-25-hello-world.html
第五步,创建首页
在根目录,创建一个index.html文件,填入以下内容
---
layout: default
title: 我的Blog
---
<h2>{{ page.title }}</h2>
<p>最新文章</p>
<ul>
{% for post in site.posts %}
<li>{{ post.date | date_to_string }} <a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a></li>
{% endfor %}
</ul>
现在目录结构变成这样,
/blog
|-- _config.yml
|-- _layouts
| |-- default.html
|-- _posts
| |-- 2012-08-25-hello-world.html
|-- index.html
第六步,发布内容
这个简单的blog,可以发布了,在github上创建仓库blog
$ git add .
$ git commit -m "first post"
$ git remote add origin https://github.com/username/blog.git
$ git push origin gh-pages
note: username换成你的用户名
打开生成的页面,http://username.github.com/blog/
这个时候,发现,很多年前,这样的网址是可以打开的,现在打不开了。现在github只能打开http://username.github.io
所以仓库做了下调整,
blog库下的用来看blog文章,
username.github.io库下的用来放首页,可浏览的URL, 及设置文件baseurl.
项目文件结构:我的目录结构丰富了些,你也可以做的更丰富更好看,红圈为主要内容

现在你可以使用建好的博客了,为了把页面做的更好看,可以加入CSS, IMAGE, JS等
可参考我的库来建博客,http://username.github.io
在github上搭建免费的博客的更多相关文章
- 在Github上搭建自己的博客(Windows平台)
折腾了好久,终于在Github上搭建了自己的博客.这里面总结一下过程希望对大家能有所帮助. Github建博优缺点 和 csdn,新浪,网易相比,在Github上可以自己实现功能 和阿里云,VPS相比 ...
- GitHub上搭建私人hexo博客操作教程
GitHub上搭建hexo博客 安装GitGit:主要用于上传博客页面到github和命令操作安装NodeNode.js:Hexo的运行环境安装HexoHexo:博客程序打开安装Git后的生成的右键菜 ...
- 在Github上搭建你的博客
title: blog on github date: 2014-03-24 20:29:47 tags: [blog,github,hexo] --- **用Github写博文** 参考http:/ ...
- 使用GitHub+hexo搭建个人独立博客
前言 使用github pages服务搭建博客的好处有: 全是静态文件,访问速度快: 免费方便,不用花一分钱就可以搭建一个自由的个人博客,不需要服务器不需要后台: 可以随意绑定自己的域名,不仔细看的话 ...
- github+hexo搭建自己的博客网站(六)进阶配置(搜索引擎收录,优化你的url)
详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定了域名: http://www.chengxinsong.cn hexo+github博客网站源码(可以clo ...
- github+hexo搭建自己的博客网站(七)注意事项(避免read.me,CNAME文件的覆盖,手动改github page的域名)
详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定域名可以查看:http://www.chengxinsong.cn 可以查看在github上生成的静态文件(如 ...
- Hexo + Github Pages搭建的个人博客
这个不算是新手的搭建流程,如果你恰巧看见这篇文章,希望你已经安装好node.git等软件,因为第一步的环境搭建准备并没有详写,默认都会了.希望能解决你的问题. 步骤: 一. 搭建环境准备 二.安装he ...
- 使用Hexo + Github Pages搭建个人独立博客
使用Hexo + Github Pages搭建个人独立博客 https://linghucong.js.org/2016/04/15/2016-04-15-hexo-github-pages-blog ...
- 在Github和oschina上搭建自己的博客网站
在Github上搭建 - 参考链接 搭建一个免费的,无限流量的Blog----github Pages和Jekyll入门 GitHub + Jekyll 搭建并美化个人网站 用Jekyll搭建的Git ...
随机推荐
- ERP中关于审批时速度太慢的SQL优化
在给客户实施ERP的时候,经常遇到客户的请购单审批时,特别慢,一个阶段要转个40.50秒左右,3个阶段就差不多要3分钟,效率很低. 检查方法如下: 1.数据库跟踪语句,找出执行时间较久的语句,结果如下 ...
- Android intent 笔记
学习android的intent,将其中的一些总结,整理的笔记记录于此. intent是一个消息传递对象,可以在不同组件间传递数据.Activity,Service,Broadcast Receive ...
- 《深入理解Java虚拟机》学习笔记之最后总结
编译器 Java是编译型语言,按照编译的时期不同,编译器可分为: 前端编译器:其实叫编译器的前端更合适些,它把*.java文件转变成*.class文件,如Sun的Javac.Eclipse JDT中的 ...
- Java并发之任务的描述和执行
简单概念 <Java编程思想>对并发概念的重要性阐述: Java是一种多线程语言,并且提出了并发问题,不管你是否意识到了.因此,有很多使用中的Java程序,要么只是偶尔工作,要么是在大多数 ...
- 使用NTP协议服务器时间同步
NTP是用来使系统和一个精确的时间源保持时间同步的协议.建议大家在自己管理的网络中建立至少一台时间服务器来同步本地时间,这样可以使得在不同的系统上处理和收集日志和管理更加容易.我们分别从windows ...
- beauty
至你我最美的邂逅 年意渐渐消失,一转眼元宵的炮竹将要响起,今天是贰零一七年二月九号,即是元宵节前两天,在这里我写下我这几天的收获. 离元宵节还有四天,我好久都没跟朋友一起认真的玩过,几天我去了我发小的 ...
- Solr vs. Elasticsearch谁是开源搜索引擎王者
当前是云计算和数据快速增长的时代,今天的应用程序正以PB级和ZB级的速度生产数据,但人们依然在不停的追求更高更快的性能需求.随着数据的堆积,如何快速有效的搜索这些数据,成为对后端服务的挑战.本文,我们 ...
- Archlinux 中安装 LyX
LyX 是 Latex 的 GUI 界面程序.使用效果类似 Office Word 和 wps.可直接生成 PDF 文件. 我使用的是 LyX + TexLive + XeTeX 组合.近期 Arch ...
- Dollar Dayz poj3181
http://poj.org/problem?id=3181 这个题目一开始就能看出来是个dp问题,但是我并没有一开始就看出来是一个完全背包为题,只是想着根据以前的方法,这个问题应该是可以找到规律的, ...
- java-信息安全(五)-非对称加密算法RSA
概述 信息安全基本概念: RSA算法(Ron Rivest.Adi Shamir.Leonard Adleman,人名组合) RSA RSA公钥加密算法是1977年由罗纳德·李维斯特(Ron Rive ...