Qiitaのブログパーツのカスタマイズ&設置

伊藤さんのブログの「Qiitaのブログパーツをはてなブログのサイドバーに設置する方法」を参考に、便乗してこのブログのサイドバーにもQiitaのブログパーツを貼り付けてみました。

同じく、@suinさんの作られているQiita Widgetをカスタマイズしています。

カスタマイズしたのは以下の点。

  • 表示件数を10件→5件に。
  • フォントのスタイルを変更。font-familyはこのブログのfont-familyをそのまま利用し、非boldにしました。
  • ブログパーツのヘッダ部分のバーを削除。削除した経緯:
    1. font-familyを定義したら、コンパイル後の script.js がエラーになってしまった*1
    2. そこで、 script.js の圧縮は行わないようにした。
    3. 圧縮を行わないので、なるべくスクリプトサイズを抑えるため、バーを削除*2

フォークしたリポジトリのREADMEに、コンパイル手順のメモを書いています。

https://github.com/tq-jappy/qiita-widget

ちなみに、ChromeFirefoxでしか確認していないので、IEでは見られるか不明…。また後で直そう…。

Qiita Widgetを作られた@suinさん、参考にさせていただいた伊藤さん、ありがとうございました。

*1:詳しく見ていないのですが、圧縮後のscript.jsに対して<!--%css%-->を置換するところでポカしてそうなので、単純にlessの書き方が悪いだけの可能性大です。

*2:バーに表示するQiitaのロゴ(Base64での画像埋め込み)が比較的容量を食っていたので。