コメントシステム DISQUS 導入

こちらのブログが随分更新が滞ってしまった。
大正区ウォーカーの方はかなりの更新頻度だったりするけど、その分私的な内容のこちらは、仕事の忙しさにかまけてサボり気味ｗ

そんな訳で久々更新ですが、既にお気づきの方もいらっさるかもしれないが、このブログのコメントシステムに「DISQUS」という別のシステムを試験的に導入してたりします。
更新してないけど、地味にイジってたりｗ

前々から「コメントが書き込めないよ！」なんていうお声をチラホラ聞いていたので、多分アンチスパムか何かで不備を起こしてるんだろうなぁとかぼんやり考えていたら、たまたま仕事でこのシステムを知る機会があったので、試しに導入してみた。

DISQUSについて、詳しくは以下からどうぞ。

DISQUSは、コメントをアウトソースできるサービスで、コメントスパムとかの心配がなく、他のDISQUSに対応したブログやWebサービスへ書き込んだコメントを一括管理でき、且つ設置も簡単というシロモノ。

DISQUSに対応したブログとは何ぞや？ってところですが、代表的なところではWord PressやMovable Type、tumblr、Bloggerといったあたり。

このブログはMovable Type4.22で今のところ管理しているので、この記事ではMT用の導入方法を紹介しようかと。

と言っても、アカウント登録やプラグインの導入、タグの実装なんかは、いろいろと詳細に記載してくださってる方々がいらっさるので、ここであえてそこに触れる必要はないかと。
以下の方々のブログをご参照頂ければ。

• MTに DISQUSを配備するには【Ogawa::Buzz】
• コメントの書き込みを楽にする目的で、「DISQUS」を導入してみました。【NOBODY:PLACE】
• 外部コメントシステム「DISQUS」の導入（MovableType）【STACK STACK STACK!】

さて、ではこのブログでは、上記のブログで触れられていないCSSの適用方法についてちょっと触れておこうかと。まぁ自分がそこの部分で苦労したからっていうのが多分にあるんやけども、結構探したけど関連する情報を書いている人が少なかったので。

上記のブログを参考に、アカウント作ってタグ貼って、再構築をしてみたものの、レイアウトの崩れにブチあたる人が多いのではないかと。
自分もあんまり詳しくないから、もしかすると概念的に間違ってるかもやけど、多分DISQUSのJava Scriptが書き出しているCSSが、ブログ側のCSSとズレているためにレイアウト崩れを起こしてしまっているんじゃないかと。

でも、リビルドして出力されたHTMLのソースを単純に開いただけでは、DSQUSが書き出しているCSSを追うことが出来なかったり。

で、対応策としては「Firebug」というFirefoxのアドオンを導入して、書き出されているCSSを紐解く必要があるわけ。これが結構メンドクサイ。。。

Firebugで導入箇所に適用されているDISQUS側のIDやClassを発見出来れば、そいつをDISQUSの管理画面内で上書きするって寸法。

DISQUSの管理画面には、ログインしてSETTINGS ＞ Customize ＞ Custom CSS と入っていって、テキストボックスにDISQUSが使用しているIDやClassの修正版ソースを書き込んでセーブするという流れ。
ブログで使用しているCSSをインポート出来るらしいねんけど、自分とこでは上手く使えなかったので、ハッキリって力技で乗り切った感じ。

ソース例を一応書いておくと、こんな感じ。

#disqus_thread { margin: 0.8em 30px 0.5em

これでようやくレイアウト崩れが解消。結構めんどくさかった。。CSSなんかもう忘れちまって。。ソースを追うのがかなり修行やった。。。

それでも、コメントやトラックバックを外部リソースに投げられるだけで、システム負荷は随分下がるし、流行りのTwitterアカウントなんかも使用出来るから、結構便利なんじゃないかと思っていたり。なんか不具合あったら誰か教えてくだされー。