Octopressへ絵文字の導入でjekyll-emoji と言うプラグインを入れてましたが、フィルターを使った導入はちょっと面倒があるので、 タグを使って書く octopress-gemoji というプラグインを作りました。
フィルター時の問題
1 2 | |
といった感じでコンテンツにemojifyと言うフィルターをかけて
変換するのですが、このフィルターはcodeblock
等にも有無をいわさず適用されます。
rawを使ってもそれより先にフィルターが適用されるので駄目です。
従って、codeblockの中に:a:の様な物があると
の様に
コードの中で変更されてしまいます。
:を:で書いたりするとcodeblockの中だとなんとかなったり
しますが、それでも上手く行かない部分があるのと
1、
コード内だと結構この様な場面があって気づかずに変換されてる事も多いのでやっぱり面倒です。
ということで、タグを使って書くプラグインを作りました。
octopress-gemoji導入
プラグインはGitHubにおいてあります。
のでcloneしたり中身を直接取ってきたりしてください。
$ git clone [email protected]:rcmdnk/octopress-gemoji.git
取ってきたら、まず、plugins/gemoji.rbをpluginsへ、
また、sass/custom/_gemoji.scssをsass/custom/へコピー。
_gemoji.scssをsass/custom/_styles.scssで
@import "gemoji";
の様にimport。
さらに、_config.ymlへ
emoji_dir: /images/emoji
とemojiの画像をインストールするディエレクトリを指定。
最後にGemfileへ
gem 'gemoji'
を加え
$ bundle install
を実行。
_gemoji.scssの中ではemojiクラスの指定がありますが、
これはjekyll-emojiでも使ってるもので、そちらを導入時に書いてあればそのまま使えます。
それ以降のemoji_dir、gemojiについても同様、
jekyll-emoji
用に入れてあれば再度設定する必要はありません。
使い方
タグを使って
{% gemoji smile %}
こんな感じで書けば
と。使える絵文字は
EMOJI CHEAT SHEET
を参考に。
同じような感じのoctemojiという プラグインもありますが、こちらはemojiの種類が中にある物限定なので、 gemojiを使う octopress-gemoji の方が沢山種類があります。