Sojiro’s Blog

This is nothing much.

Octopressのテーマを変える

Octopressのテーマを変更する

今回は既に作られ、公開されているテーマを拝借する

好みのテーマを探す

3rd Party Octopress Themesにテーマリストが公開されている。ここから使いたいテーマを探す。

Octopress ThemesにPreviewが見やすくまとめられている

今回使用するテーマ

テーマのインストール

テーマをダウンロード

テーマ毎にclone元とclone先のpathを指定する

1
2
$ cd git/octopress
$ git clone GIT_URL .themes/THEME_NAME

テーマ: Whitespaceの場合

1
$ git clone git://github.com/lucaslew/whitespace.git .themes/whitespace

テーマをインストール

テーマを指定して rake install

1
2
$ rake install['THEME_NAME']
$ rake generate

テーマ: Whitespaceの場合

1
2
3
4
5
6
7
8
9
$ rake install['whitespace']
A theme is already installed, proceeding will overwrite existing files. Are you sure? [y/n] y
## Copying whitespace theme into ./source and ./sass
mkdir -p source
cp -r .themes/whitespace/source/. source
mkdir -p sass
cp -r .themes/whitespace/sass/. sass
mkdir -p source/_posts
mkdir -p public

テーマを上書きするか?と聞かれたので y で答える

1
2
3
4
5
6
$ rake generate
## Generating Site with Jekyll
overwrite source/stylesheets/screen.css
Configuration from /Users/user.name/git/octopress/_config.yml
Building site: source -> public
Successfully generated site: source -> public

デプロイ

テーマをインストールしたらデプロイ

1
$ rake deploy

ページにアクセスしてテーマが変更されていることを確認できればok

テーマがアップデートされたら

テーマが開発者によってアップデートされたら手元のファイルもアップデートする

1
2
3
4
$ cd octopress/.themes/THEME_NAME
$ git pull
$ rake install['THEME_NAME']
$ rake generate

テーマ: Whitespaceの場合

1
2
3
4
$ cd octopress/.themes/whitespace
$ git pull
$ rake install['whitespace']
$ rake generate

デプロイしてアップデート完了

1
$ rake deploy

Comments