最近，因之前的博客是通过hexo搭建的，而通过hexo搭建的样式，有点烂大街的赶脚。另外，想对它做一些改动，看着它的代码有点头大。然后，就接触了Octopress，稍微了解了一下，就决定把我的博客迁到这个上面了。原因有二：1.是基于Ruby开发的，正是我目前在学的语言；2.相对于hexo提供更多的功能。废话不多说，开始搭建第一篇Octopress博客吧。
配置Octopress
-
准备工具
我们需要git、ruby > 1.9.3、bundler -
项目clone
git clone git://github.com/imathis/octopress.git blog
在此把blog设置为我们的写博客的目录。
Tips：建议fork这个github的地址，建立一个个人的配置，这样就可以对网站的样式进行个人配置的保存工作。
- 安装依赖
bundle install
- 配置主题
rake install
这里会安装Octopress提供的默认主题。
- 错误解决
在执行主题配置，执行rake的时候，会报下面的错误。具体原因，是因为rake版本不匹配，笔者安装的rake版本过多的问题。
rake aborted!
Gem::LoadError: You have already activated rake 11.1.2, but your Gemfile requires rake 10.5.0. Prepending `bundle exec` to your command may solve this.
按照提示的解决方案，添加bundle exec就可以解决，那每次这样输入，不是太麻烦了么。还有另一个解决方案，移除10.5.0的rake版本，在命令行下，执行命令如下：
gem uninstall rake
系统会列出所有的rake版本，选择相应版本即可。
创建blog
- 创建blog
Octopress的命令，都是通过rake来执行的，接下来，咱们来看一下Octopress提供了哪些功能？执行rake -T，来查看所有的任务命令，可以看到有如下的输出：
rake clean # Clean out caches: .pygments-cache, .gist-cache, .sass-cache
rake copydot[source,dest] # copy dot files for deployment
rake deploy # Default deploy task
rake gen_deploy # Generate website and deploy
rake generate # Generate jekyll site
rake install[theme] # Initial setup for Octopress: copies the default theme into the ...
rake integrate # Move all stashed posts back into the posts directory, ready for...
rake isolate[filename] # Move all other posts than the one currently being worked on to ...
rake list # list tasks
rake new_page[filename] # Create a new page in source/(filename)/index.markdown
rake new_post[title] # Begin a new post in source/_posts
rake preview # preview the site in a web browser
rake push # deploy public directory to github pages
rake rsync # Deploy website via rsync
rake set_root_dir[dir] # Update configurations to support publishing to root or sub dire...
rake setup_github_pages[repo] # Set up _deploy folder and deploy branch for Github Pages deploy...
rake update_source[theme] # Move source to source.old, install source theme updates, replac...
rake update_style[theme] # Move sass to sass.old, install sass theme updates, replace sass...
rake watch # Watch the site and regenerate when it changes
从中，可以看到我们将会用到的几个常用命令deploy来执行网站的部署，new_page来创建页面，new_post来创建新的博客。
- 新建第一篇博客
rake new_post['first blog']
执行完之后，就会得到如下的系统输出：
mkdir -p source/_posts
Creating new post: source/_posts/2016-04-23-first-blog.markdown
- 预览页面
这里使用preview命令
rake preview
之后，会看到提供给的提示是端口4000，在浏览器中输入：localhost: 4000，则可以看到我们的first blog了。如图：
First blog.png
- 错误解决
在执行新建博客的时候，会遇到rake new_post不识别的问题。这个在官方文档中，提到是由我的命令行工具使用了zsh的缘故。解决方案，打开zsh的配置文件.zshrc。在其中，添加如下代码：
alias rake='noglob rake'
网站配置
这里Octopress主要的配置文件，是由根目录下面的_config.yml文件，来进行配置的。主要代码如下，可以看到看到其支持的功能非常丰富：
# ----------------------- #
# Main Configs #
# ----------------------- #
url: http://alighters.com
title: My Octopress Blog
subtitle: A blogging framework for hackers.
author: Your Name
simple_search: https://www.google.com/search
description:
# Default date format is "ordinal" (resulting in "July 22nd 2007")
# You can customize the format as defined in
# http://www.ruby-doc.org/core-1.9.2/Time.html#method-i-strftime
# Additionally, %o will give you the ordinal representation of the day
date_format: "ordinal"
# RSS / Email (optional) subscription links (change if using something like Feedburner)
subscribe_rss: /atom.xml
subscribe_email:
# RSS feeds can list your email address if you like
email:
# ----------------------- #
# Jekyll & Plugins #
# ----------------------- #
# If publishing to a subdirectory as in http://site.com/project set 'root: /project'
root: /
permalink: /blog/:year/:month/:day/:title/
source: source
destination: public
plugins: plugins
code_dir: downloads/code
category_dir: blog/categories
markdown: rdiscount
rdiscount:
extensions:
- autolink
- footnotes
- smart
highlighter: pygments # default python pygments have been replaced by pygments.rb
paginate: 10 # Posts per page on the blog index
paginate_path: "posts/:num" # Directory base for pagination URLs eg. /posts/2/
recent_posts: 5 # Posts in the sidebar Recent Posts section
excerpt_link: "Read on →" # "Continue reading" link text at the bottom of excerpted articles
excerpt_separator: "<!--more-->"
titlecase: true # Converts page and post titles to titlecase
# list each of the sidebar modules you want to include, in the order you want them to appear.
# To add custom asides, create files in /source/_includes/custom/asides/ and add them to the list like 'custom/asides/custom_aside_name.html'
default_asides: [asides/recent_posts.html, asides/github.html, asides/delicious.html, asides/pinboard.html, asides/googleplus.html]
# Each layout uses the default asides, but they can have their own asides instead. Simply uncomment the lines below
# and add an array with the asides you want to use.
# blog_index_asides:
# post_asides:
# page_asides:
# ----------------------- #
# 3rd Party Settings #
# ----------------------- #
# Github repositories
github_user:
github_repo_count: 0
github_show_profile_link: true
github_skip_forks: true
# Twitter
twitter_user:
twitter_tweet_button: true
# Google +1
google_plus_one: false
google_plus_one_size: medium
# Google Plus Profile
# Hidden: No visible button, just add author information to search results
googleplus_user:
googleplus_hidden: false
# Pinboard
pinboard_user:
pinboard_count: 3
# Delicious
delicious_user:
delicious_count: 3
# Disqus Comments
disqus_short_name:
disqus_show_comment_count: false
# Google Analytics
google_analytics_tracking_id:
# Facebook Like
facebook_like: false
这里，笔者稍微简单修改之后的界面，来看看效果如何：
效果.png
有木有感觉异常简单呢？
网友评论