ページ

2015年10月21日

ホントに3分でブログができるか試したよ

enter image description here

3分でブログができるというので、実際につくってみたら・・・3日かかった。

HEXOを使うとわずか3分でブログが作成できるらしい

LIGINC社のブログによると、HEXO(スタティック・サイト・ジェネレーター)を使うと3分でブログを開設できるというので実際に試してみたら、なんとそこそこの見た目にするために3日もかかってしまったよ。

スタティック・サイト・ジェネレーターのランキング

enter image description here

2015年10月21日現在のランキングをみると、Hexoは第3位につけています。

LIGLIC社のブログ記事の頃から1年経って5位から3位へとランクアップしています。

これは、かなり使いやすいのではないかと期待が持てます。

HEXO

インストール方法は公式ページにかかれているようにnvmやnpmを使うと簡単にインストールできます。

実際に初期のテーマlandscapeを使ってローカルで記事をチェックしていくのですが、WordPressと比べるとそこら中で英語表記が気になりますね。

ここで、RSSを見ようとするとRSSがないんです!

RSSフィード

$ npm install hexo-generator-feed

これでRSSフィードは生成できるようになりました。

これを調べる時点で3分超えてしまいました・・・RSSフィードなしでブログを作るというのもねぇ。

サイトマップ

次に気になったことは、サイトマップですけどこれもインストールしただけでは生成してくれません。

$ npm install hexo-generator-sitemap

サイトマップ・ジェネレータをインストールして、_config.ymlに下記の設定を追加するとサイトマップが出てきます。

sitemap:
  path: sitemap.xml

ブログとしてのスタートポイントの位置づけの違いでしょうか、WordPressのようにインストールしただけでそこそこ揃っている状態にはなっていないようです。

記事を1〜2つ追加してみたら

ブログの表記が日本語化されていませんので、WordPressと比べて粗野な感じがします。

英語だったり中国語だったりするところを日本語にします。

トップのメニュー

トップに表示される、 “Home”や”Archive”は_config.ymlで設定を変更することで日本語にできます。

menu:menu:
  blogger: http://www.sumisada.com
  ホーム: /
  アーカイブ: /archives

記事の日付

インデックス・ページに表示される日付が英語表記(Oct 20 2015)となっていましてこの表示を変更しようとしてかなり苦戦しました。

結局テーマ内の表示部分を直接変更しました。

theme/landscape/layout/_partial/archive-post.ejs

日付フォーマットを年月日表示に変更します。

date_format: 'LL'

これも情報が無くてライブラリを調べるのに時間がかかってしまいました。

Read More

インデックス・ページに記事抜粋(<!–more–>を使う必要があります)を表示すると、Read moreが表示されてしまいます。

テーマフィル中の_config.ymlを変更します。

theme/_config.yml
excerpt_link: 記事を読む

だいぶ面倒くさいです。

左サイドバーのタイトル

サイドバーのタイトルや日付などが軒並み英語表記ですのでこれらも日本語表記に変更します。

どこかに設定ファイルがあるのかと思いましたが、タイトルはハードコーディングしてありましたので、個々のファイルを変更して日本語にしました。(テーマが更新されてもアップデートできません)

アーカイブの日付

アーカイブの日付がOct 2015(10)などとなっていますので、これも日本語表記に変更します。

themes/landscape/layout/_widgets/archive.ejs

変更前

 <%- list_archives() %>

これだと、日付フォーマットが指定されていませんので、フォーマットを指定します。

変更後

 <%- list_archives({format: 'YYYY年MM月'}) %>

最新記事の数

最新記事の数を変更したいとおもったのですが、_config.ymlでは変更ができないんですね。

themes/landscape/layout/_widgets/recent_posts.ejs

ここもハードコーディングでした:

<% site.posts.sort('date', -1).limit(5).each(function(post){ %>

limitを_config.yml(テーマのね)で変更できるようにします。

<% site.posts.sort('date', -1).limit(theme.show_count).each(function(post){ %>

_config.ymlに値を設定して変更します。

show_count 10

その他

インデックスページの”Commnets”や”Share”もページファイルに直接書かれているので日本語に変更します。

これでようやく下準備ができました。

github.comに展開とドメイン設定

ローカルではそれなりにシンプルなブログに見えるようになりましたので、一旦github.comへアップします。

ドメインはエイリアスを設定しています。

結局

HEXOを使ってブログらしく見えるように、見た目を揃えるところまで行ってみましたが、ここまでに足掛け3日もかかってしまいました!!!

しかし、洗練されていないというか変更場所がバラバラしていて変更する手間がすごく多いことと、ドキュメントが整備されていないので調べる手間もより多くかかります。

メジャーになるにはもう少し、言語対応とかが洗練されないと誰でも(中学生くらい)が使いはじめるには難しいと思います。

実際に作ったブログ