Github+Jekyll —— 创建个人免费博客（六）jekyll结构优化和Skinny-Bones主题的使用

摘要：

本文中我将介绍一下如何在github上搭建个人Blog（博客），也顺便让我们掌握一下github Pages功能，另外还涉及到Jekyll技术。

===============================分割线====================================

之前的文章我们已经顺利把自己的jekyll页面发布到GitHub上了，但是你不会真的满足于那么点点的成就感吧，我们的目标当然是把这个页面变成我们个人博客，至少不能太丑，所以我们有必要了解一下jekyll的原理和工程结构，从而优化我们的页面。

一、jekyll结构：

说到jekyll，其实它的真正强大之处在于可以将很多例如：markdown、textlie等模板语言转化成HTML，还能像PHP/Django框架那样使用模板，它能引入模板，其default.html模板相当于Django的base.html模板。其工程结构：

|-- _config.yml
|-- _includes
|-- _layouts
|   |-- default.html
|   `-- post.html
|-- _posts
|   |-- 2007-10-29-why-every-programmer-should-play-nethack.textile
|   `-- 2009-04-26-barcamp-boston-4-roundup.textile
|-- _site
`-- index.html

每部分的功能：

_config.yml：配置文件，主要用于设置基本信息和效果

_includes：存放可复用的小模块，方便通过“{% include file.ext %}”调用，此命令调用includes中的file.ext文件

_layouts：模板文件的存放位置，这里的模板需要通过YAML front matter来定义

_posts：动态内容，一般博客正文存放在这个文件夹，命名有严格的规定：2016-04-15-artical-title.MARKUP，MARKUP就是你所使用标记语言的文件后缀名，根据_config.yml中设定的链接规则，所以可以灵活修改，文章的日期和标记语言后缀你与文章的标题是独立的

_site：jekyll生成的最终文档，可以放在.gitignore文件中忽略它

常用的编辑器Prose（所见即所得），通过打开http://prose.io/打开编辑器:

点击AUTHORIZE ON GITHUB验证github账号，然后便可以导航到相应的站点：

在工程列表中选择我们的博客工程，进入工程可以看到工程文件列表：

直接点击我们要进行修改的文件即可进入编辑模式，在编辑模式左侧有编辑器的一些工具选项：

二、拓展功能：

1.评论管理：使用Disqus

2.代码高亮插件：DlHightLight插件：支持语言少

Google Code Prettify插件：支持语言多

3.使用专用的编辑MarkDown的编辑器：MardownPad

三、简单快速：

若要简单快速地搭建自己的博客主题，我们可以下载GitHub上面别人优秀的结构，然后再自己修改内容，这显然更为高效，这里我参考的是Hux博客的主题，博主使用的是Skinny Bone的主题自行修改的，然后自己再进行内容修改，这里我修改后的结果：何乐不为~ Blog

注意：添加新的博客时，在_posts目录下添加符合命名要求的.markdown文件即可

Github+Jekyll —— 创建个人免费博客（六）jekyll结构优化和Skinny-Bones主题的使用相关推荐

个人博客代码_Jekyll + Github Pages 搭建个人免费博客
今天亲手通过 Jekyll 搭建了一套免费博客,搭建步骤其实超级简单.你不需要购买域名,也不需要购买服务器,就可以轻松拥有你自己的博客.Jekyll 的核心是一个文本转换引擎.它的方便之处在于支持多种 ...
hexo+github+hexo-theme-matery搭建个人免费博客
个人博客前言 GitHub page提供了免费的服务搭建免费域名 xxx.github.io xxx是你的GitHub用户名免费的代码存储空间全是静态文件,快速访问 git版本管理,能快速回滚 ...
Github部署+Hexo搭建免费博客 next主题美化
前言工作学习中难免会遇到一些问题,有些问题比较复杂,第一遇到了百度许久,第二次遇到了还是要百度许久!想想倒不如遇到问题记下来写在博客上!以后好查阅.在CSDN上面看到hexo+github可以免费 ...
Github+Hexo 搭建一个个人博客
前言: 我最近想要将计算机界的几个基础课程的学习做一下笔记,可是又不想要写在这个wordpress站上(这个站专门负责花里胡哨的东西),所以我就想在github再创建一个小博客,作为一个分站. 提示: ...
github page hexo博客gitee_利用Github和hexo搭建个人免费博客
利用Github和hexo搭建个人免费博客详细过程: 概述: 详细的介绍了利用github和hexo搭建免费的博客,内容详细,浅显易懂,容易上手,大家一起进来看看吧! 1.配置Github相关操作: ...
github+hexo搭建自己的博客网站（六）进阶配置(搜索引擎收录，优化你的url，添加RSS)...
详细的可以查看hexo博客的演示:https://saucxs.github.io/ 绑定了域名: http://www.chengxinsong.cn hexo+github博客网站源码(可以clo ...
jekyll网站上传服务器,jekyll 高效搭建个人博客之完整流程
jekyll.png 原创精选来自我的博客文章目录说在前面的话作为一个和电脑.代码打交道的我,一直都想拥有自己的博客,一切都显得那么高(zhuang)大(bi)上(yong),在下定决心之后就在 ...
GitHub Pages + Hexo搭建个人博客网站，史上最全教程
文章目录一.准备工作 1. GitHub账号 2. 安装Git 3. 安装NodeJS 二.创建仓库三.安装Hexo 四.更换主题 1. NexT 主题 2. Fluid主题五.创建文章六.个 ...
在Github上搭建自己的博客(Windows平台)
折腾了好久,终于在Github上搭建了自己的博客.这里面总结一下过程希望对大家能有所帮助. Github建博优缺点和 csdn,新浪,网易相比,在Github上可以自己实现功能和阿里云,VPS相比 ...

Github+Jekyll —— 创建个人免费博客（六）jekyll结构优化和Skinny-Bones主题的使用

Github+Jekyll —— 创建个人免费博客（六）jekyll结构优化和Skinny-Bones主题的使用相关推荐

最新文章

热门文章