window下Jekyll建站过程
> 前言
最近决定要写一个博客,先后注册了博客园和CSND的博客,但是他们的界面主题都不是很符合自己的要求,还没有足够个性化的发挥空间,遂决定自己建一个博客。
网上找了一下教程,感觉都不太详细,容易踩坑,所以就想详细一下自己的搭建过程,不能算作教程吧。
希望大家踩少点,如有错误,各位看官老爷们拍轻点。
既然选择了自己建一个,就需要选择一个合适自己用的博客引擎了,主要就这几大引擎:
- wordpress
- jekyll
- octopress
- hexo
- 还有FarBox和Ghost,这两个没有太多了解就不说了
wordpress:
老牌博客引擎,网上很多前人踩过的坑
功能强大,需要服务器数据库,插件丰富,扩展功能方便
搭建需要基本PHP和MySQL知识,搭建好后就傻瓜式操作
wordpress相对臃肿,迁移麻烦
jekyll:
静态网页生成引擎,不需要数据库
搭配github或gitcafe就可以不用自己的服务器
用Ruby开发,需要基本GIT知识,支持markdown语法
octopress:
基于jekyll的静态网页生成引擎,类似于javascript和JQuery的关系,就是已经打包好了一些博客框架
hexo:
一样是静态网页生成引擎,不需要数据库
搭配github或gitcafe就可以不用自己的服务器
用node.js开发,作者是台湾大学生@tommy351
相比jekyll,安装和命令更简单,生成速度更快
同样需要基本GIT知识,支持markdown语法
这个是作者的网站 Zespia 可以围观一下
只有最适合自己的,没有最好的,根据自己的需要选择,我这里据说jekyll比较能折腾(坑多),所以就选用了jekyll。
我是在window下搭建的,所以linux和mac的老爷们就去下家看看吧。
> 配置环境
>> 安装Ruby
window要用 Rubyinstaller 安装(linux和mac可以直接在官网下载,因为Ruby对window不太友好)
安装时把下面两个勾 勾上
安装好后,运行cmd.exe,输入 ruby -v
,出现版本号,则安装成功
>> RubyGems
用RubyInstaller安装Ruby之后都自带Gems的,有需要可以在这里下载 RubyGems
>> 解压DEVELOPMENT KIT
下载 DEVELOPMENT KIT,就在rubyinstaller下载页面的最下面。
下载好后解压到随意位置
进入刚才解压的文件夹,空白处 Shift + 右键打开 命令窗口(cmd.exe),执行以下两条命令
ruby dk.rb init
ruby dk.rb install
如果安装的是64bit的Ruby,可能会报错,需要修改dk.rb
文件
用文本编辑器打开,在 REG_KEYS
中添加一条:
REG_KEYS = [
'Software\RubyInstaller\MRI',
'Software\RubyInstaller\Rubinius',
'Software\Wow6432Node\RubyInstaller\MRI'
]
>> 换镜像源
因为墙的问题,需要把原来的镜像源换了,我目前是用阿里云的镜像,有人用淘宝的,但我那时不行了,可能以后阿里云的也会失效。
执行命令
gem sources --add http://mirrors.aliyun.com/rubygems/ --remove http://rubygems.org
>> 升级Gem
换了镜像后,执行命令:
gem update
然后等升级完成,这个步骤需要联网
>> 安装bundler
如果配置过Jekyll环境或者安装过bundler,可以跳过这步。
更新完了,然后安装bundler,执行命令:
gem install bundler
成功安装bundler后,bundler 也需要换镜像源
> 安装Jekyll
前面弄了这么就,终于可以入正题了,执行命令:
$ gem install jekyll
Jekyll需要的gem包都会自动安装
> 创建博客站点
打开你需要创建博客的目录下,比如我在E盘下创建,执行创建博客的命令,等待完成:
jekyll new yourBlogName
> 开启服务器
创建完博客站点后,用cd
命令进入博客的目录下,执行以下命令:
cd yourBlogName
jekyll serve --watch
不加--watch
则不会检测文件夹内的变化,修改文件后需要重新启动jekyll。
Jekyll服务器默认端口是4000,所以打开浏览器输入:http://localhost:4000 即可看到生成的博客页面。
> Jekyll目录结构
Jekyll 的核心其实是一个文本转换引擎。它的概念其实就是: 你用你最喜欢的标记语言来写文章,可以是 Markdown,也可以是 Textile,或者就是简单的 HTML, 然后 Jekyll 就会帮你套入一个或一系列的布局中。
在整个过程中你可以设置URL路径, 你的文本在布局中的显示样式等等。这些都可以通过纯文本编辑来实现,最终生成的静态页面就是你的成品了。
一个基本的 Jekyll 网站的目录结构一般是像这样的:
blog
.sass-cache
_posts
2017-04-21-welcome-to-jekyll.markdown
_site
.gitignore
_config.yml
about.md
Gemfile.lock
Gemfile
index.md
根据实际需要,可能还需要创建如下文件或文件夹:
1、 _includes:用于存放一些固定的HTML代码段,文件为.html格式,可以在模板中通过liquid标签引入,常用来在各个模板中复用如 导航条、标签栏、侧边栏 之类的在每个页面上都一样不变的内容,需要注意的是,这个代码段也可以是未被编译的,也就是说也可以使用liquid标签放在这些代码段中
2、 image和js等自定义文件夹:用来存放一些需要的资源文件,如图片或者javascript文件,可以任意命名
3、 CNAME文件:用来在github上做域名绑定的,将在后面介绍
4、 favicon.ico:网站的小图标
这些目录结构以及具体的作用可以参考 官网文档
到此,博客初步搭建算是完成了
> 使用Jekyll写博文
所有的文章都是放在 _posts
目录下,文件格式为 mardown 格式,要注意文件名的格式前面必须为必须为 年-月-日-文章名
,且最好不要用中文。
此文件上的日期跟实际页面显示的日期没关系,页面的日期由YAML头信息中的date来决定(没有date时才由文件名决定)
必须在文章头部添加YAML头信息(YAML front- matter):
---
layout: post
title: "Jekyll和Github搭建个人静态博客"
date: 2016/6/26 13:03:42
categories: original
---
正文...
- layout表示使用post布局
- title 是文章标题
- date是自动生成的日期
必须按照y-m-l的语法来写,否则就会出现编译错误,可以只用YYYY-MM-DD来显示日期在后面加上 HH:MM:SS+00:00 来表示更具体的时间 - categories
是该文章生成html文件后的存放目录,也就是文章的分类属性,可以在_site/original下找到。(category
只能添加一个分类属性, categories 可以添加多个分类属性,各属性使用空格隔开)
> 报错处理
常见的报错是Bundler和镜像源问题,上面已经处理好了,一般不会有问题。
>>Error: jekyll-sitemap
这个是因为Jekyll 3.1.1版本的问题,这个版本无法使用jekyll-sitemap,错误信息提示:
Configuration file:...
Dependency Error: Yikes! It looks like you don't have jekyll-sitemap or one of its dependencies installed. In order to use Jekyll as currently configured, you'll need to install this gem. The full error message from Ruby is: 'cannot load such file -- jekyll-sitemap' If you run into trouble, you can find helpful resources at http://jekyllrb.com/help/!
jekyll 3.1.1 | Error: jekyll-sitemap
解决办法:
- 打开当前目录下的 _config.yml 文件,把 gems: [jekyll-paginate,jekyll-sitemap] 换成
gems: [jekyll-paginate] ,也就是去掉jekyll-sitemap。 - 升级 jekyll 版本
>>其他错误
暂时我遇到的坑就这些了,如果还是报错的话,我推荐大家到各工具的github或stackoverflow上找一下原因:
Ruby问题 (其实大多报错是Ruby的问题)
镜像源问题 (就是有SSLError,connect之类的报错信息)
Jekyll问题,stackoverflow
另外还有Jekyll的官网和中文网
最后说一句,这个只是自己搭建过程中踩过的坑,分享给大家,不算很好的教程,其实最好的教程是官方文档,Jekyll有中文网,并不用担心英语读不懂。
完.
window下Jekyll建站过程的更多相关文章
- FarBox的建站过程
FarBox的建站过程 本文转自:http://mosir.org/html/y2012/How-to-build-your-website-by-farbox.html 作者: mosir 时间: ...
- SEO 建站过程复盘
今天在A5看到一篇关于一个牛站的复盘,整个建站过程值得借鉴. https://www.admin5.com/article/20200218/943930.shtml
- Python+Flask+MysqL的web技术建站过程
1.个人学期总结 时间过得飞快,转眼间2017年就要过去.这一年,我学习JSP和Python,哪一门都像一样新的东西,之前从来没有学习过. 这里我就用我学习过的Python和大家分享一下,我是怎么从一 ...
- 《Dotnet9》建站-记录建站过程中使用的一些网址
时间如流水,只能流去不流回! 点赞再看,养成习惯,这是您给我创作的动力! 本文 Dotnet9 https://dotnet9.com 已收录,站长乐于分享dotnet相关技术,比如Winform.W ...
- Drupal建站过程思考——不识庐山真面目,只缘身在此山中
使用drupal与没有使用drupal,在网站的设计过程上本质是一样的!所以,我们在使用drupal建一个新网站时,要时刻联想自己在没有drupal时是如何设计开发的. 不使用drupal时,我们通常 ...
- Hexo建站过程总结
Hexo 是一个基于 Node.js 快速.简洁且高效的博客框架,可以将 Markdown 文件快速的生成静态网页,托管在 GitHub Pages 上. 由于原来博客的主机费用问题,我没有办法再在那 ...
- 利用阿里云Centos7建站过程
以下可能不尽详述,如有问题欢迎指出 准备过程:1. 阿里云主机一台2.域名一个 3.github个人帐号开始: 1.以root帐号登录云主机 2.安装apache [root@192 ~]# yum ...
- jekyll建站详细教程
Jekyll是一款静态博客生成器,也是github page支持的后台引擎,所以如果你有以下需求,极力推荐使用jekyll搭建博客,>>浏览我的博客 个性化的展示界面,站点逻辑 个性化的域 ...
- Web网站建站过程(白嫖)——域名
目录 1.域名注册商(选一个吧) 2.域名注册 没有域名建啥站? 1.域名注册商(选一个吧) 到时候你们就会想起: ...... 但是我们不用上面的,因为上面的太费Q,我们要用的是-- 2.域名注册 ...
随机推荐
- ajax 常用格式
$.ajax({ url: "/", //请求路径 type: "post",//请求方式 data: "json", //发送请求的数据格 ...
- [蓝桥杯][2016年第七届真题]路径之谜(dfs)
题目描述 小明冒充X星球的骑士,进入了一个奇怪的城堡. 城堡里边什么都没有,只有方形石头铺成的地面. 假设城堡地面是 n x n 个方格.[如图1.png]所示. 按习俗,骑士要从西北角走到东南角. ...
- ASP.NET中类的多语言编译
App_Code 文件夹中同时使用多种语言编程的方法 在web.config文件里,加入如下的配置 <configuration> <system.web> <comp ...
- cookie session token详解
cookie session token详解 转自:http://www.cnblogs.com/moyand/ 发展史 1.很久很久以前,Web 基本上就是文档的浏览而已, 既然是浏览,作为服务器, ...
- 关于cg语言中求法向量 N=mul(worldMatrix_IT,normal); 的随笔
解释一下标题,N是变换到世界坐标后的法向量,worldMatrix_IT是变换矩阵worldMatrix的逆的转置矩阵,normal就是模型坐标的法向量. 对于点p,我们根据变换矩阵M(即worldM ...
- Mac下配置maven和集成到ecclipse(Mac 10.12)
1.到官网下载maven,http://maven.apache.org/download.cgi 下载好的tar.gz包解压出来,并重命名为maven3,拷贝到/usr/local目录下 2.配置环 ...
- Robot Framework自动化测试二(元素定位)
前言 在学习的过程中,可能会误认为Robot framework 只是个web UI测试工具,更正确的理解Robot framework是个测试框架,之所以可以拿来做web UI层的自动化是国为我们加 ...
- spring自定义标签之 自我实现
引言: 最近心情比较难以平静,周末的两天就跑出去散心了,西湖边上走走,看日落,还是不错的.回来博客上发现,在自定义标签上,最后一步实现忘记加上了.其实,人生的路程中,我们总是实现着自我的价值,让自己 ...
- jenkins配置权限不对导致无法登陆或者空白页面解决办法
找到.jenkins/config.xml文件:替换为:1.<authorizationStrategy class="hudson.security.AuthorizationStr ...
- linux下创建网卡配置
大家都知道linux系统一般作为服务器来用,而且很多情况的设置都是需要通过字符界面修改配置文件来设置.比如说配置网卡IP是修改/etc下面的 ifcfg-eth0,如果配置文件没有了怎么办呢?本经验以 ...