分类: Git, 技术blog收集

如何建立一个免费的Octopress Blog (GitHub Blog)






之前我大概介绍了下关于jekyll,在结尾的时候也提到了,Octopress是一个在Jekyll基础上建立的一个关于blog的framework。
这里大概介绍一下如何建立一个Octopress blog,如何推送到Github,如何生成一个免费的Gihub blog。
相关推荐文章:
关于Jekyll
如何建立一个自己的GitHub网页
首先,想说明的是,Octopress是一个给GEEK设计的BLOG,所以你需要一些基本的程序背景,回一点git的知识,会一点sccirpt的知识。如果你只是普通的想写建立一个免费的BLOG,推荐你看看我写的WordPress系列,感觉可能会比较适合你。
首先,和我们讲到的Jekyll一样,你需要如下配置:
– Ruby
– RubyGems
– Linux, Unix, or Mac OS X
然后现在我们来安装Octopress :

//如果你在Mac,可能需要加上 sudo 给于如何的access rights
git clone git://github.com/imathis/octopress.git octopress //从github复制octopress代码
cd octopress

gem install bundler //安装dependencies
bundle install

rake install //安装Octopress默认theme

一个简单的octopress的框架都安装好了。这里如果你在rake install的时候得到如下的错误提示:

你需要的是,打开otctopress文件夹,找到一个叫“Gemfile”的文件,找到下项代码,并且改为:

gem 'rake', '~> 10.1.1'

安装好了octopress之后,我们来说说如何配置,你可以打开_config.yml文件,修改如下的配置

然后下最后一段,有第三方服务的配置:

Github  		- List your github repositories in the sidebar
Twitter 		- Add a button for sharing of posts and pages on Twitter
Google Plus One 	- Setup sharing for posts and pages on Google's plus one network.
Pinboard 		- Share your recent Pinboard bookmarks in the sidebar.
Delicious 		- Share your recent Delicious bookmarks in the sidebar.
Disqus Comments 	- Add your disqus short name to enable disqus comments on your site.
Google Analytics 	- Add your tracking id to enable Google Analytics tracking for your site.
Facebook 		- Add a Facebook like button

填入你的相关账号,Octopress会自动帮你配置。
以上全部配置好了之后,我们回到命令行,来生成我们的第一个post.

  rake new_post["title"]

系统会自动在source/_posts文件夹下建立一个如下格式的文件:YYYY-MM-DD-post-title.markdown
之后用你习惯的texteditor打开文件,你就可以开始Blog了,这里我们举个简单的例子:

rake new_post["Hello Octopress"]
# 文件建立 source/_posts/2013-12-29-Hello-Octopress.markdown
//打开文件2013-12-29-Hello-Octopress.markdown
---
layout: post
title: "Setup a octopress blog with Github" //文章标题
date: 2013-12-26 20:42:38 +0800
comments: true
categories: [WEB, Octopress] //blog分类
---
这里简单介绍一下markdown的SYNTAX

#H1 标题 
##H2 标题 
### H3 标题

HTML生成如下:

<h1>H1 标题</h1>
<h2>H2 标题</h2>
<h3>H3 标题</h3>
-----------------------

> This is a blockquote. 
> This is the second paragraph in the blockquote.
> ## This is an H2 in a blockquote
HTML :
<blockquote>
    <p>This is a blockquote.</p>

    <p>This is the second paragraph in the blockquote.</p>

    <h2>This is an H2 in a blockquote</h2>
</blockquote>

*斜体*
**blod(加黑)**
HTML:
<em>斜体</em>
<strong>加黑</strong>

- 1
- 2
- 3
HTML:
<ol>
	<li>1</li>
	<li>2</li>
	<li>3</li>
</ol>

This is an [example link](http://example.com/).//超链接 
<p>This is an <a href="http://example.com/">example link</a>.</p>

图片:
{% img [class names] /path/to/image [width] [height] [title text [alt text]] %}
//本地图片复制进source/images文件夹

上面是最简单常用的markdown编辑,所有的octopress blog都要按照这个markdown规则来写,更多的Markdown的例子和介绍,你可以看这里: markdown basic
好了到了最后,如何生成一个Blog的时候了,这里有两种方式,我们先说本地查看:

rake generate   # Octopress会将你的Markdown代码生成HTML
rake preview    # Octopress自带的web Server,然后你可以打开http://localhost:4000 预览你的网页

现在根据预览,你可以逐步修改你的blog,一切就绪之后,我们就可以push到github,让Github作为我们的免费服务器,这里推荐你先看看如何建立一个自己的GitHub网页
建立一个http://username.github.io 的repo,然后在命令行键入:

rake setup_github_pages 
//填入你的repo的URL链接

然后键入

    rake generate
    rake deploy

Octopress会自动推送进入Github,然后你大概网页http://username.github.io,应该就能看到你新的Blog了。

备注:
这里小小的说明下,octopress在运行“rake setup_github_pages”,命令的时候,自动建立了一个叫”source”的branch,你所有的源代码回被推送进去,然后master变成了编译之后,github所支持的代码。
所以你在推送的时候,遇到github的错误提示,不能commit的时候,需要查看下,很可能你本地的branch和要推送的github 不在同一个Branch,所以导致推送失败。




发表评论