DisqusウイジットをArthemiaのフッタ部分に設置する

Disqusウイジットを、Wordpressに掲載する方法は、「Disqusのコメントをサイドバーに載せる(ブログパーツ)」で説明したが、Arthemiaテーマで使用する際、少々問題が発生し、その覚え書き。

Arthemiaテーマのサイトで、disqusのウイジットコードをフッタのバーに表示しようとすると、デフォルトのテーマのCSSのデザイン指定を受け、フォントカラーがうまく表示されない。サイドバーでは問題ない。

どうも、背景を黒く、文字を白く表示するようなCSSになっていて、それにdisqusのウイジットコードが影響をうけてしまう。

そこでArthemiaのCSSファイルを少々いじった。

もともとArthemiaは、フッタのサイドバー3カラムに

  • 左:id=”recentpost”
  • 中:id=”mostcommented”
  • 右:id=”recent_comments”

を割り当てている。
この右側にdisqusのウイジットコードを記述すると、id=”recent_comments”のCSSの影響をうけ、字がデザイン上みづらい。そこで、その内側に、もう一つ、idを割り当て、デザインを変更する。

こんな書き方がいいのかどうか分からないが。

ウイジット内は、これでdisqusのコードを挟む。

CSSには、下記の文を追加。
CSSの記述ドキュメントに、id=”recent_disqus”を設置して、下記のように記述。オリジナルは、id=”recent_comments”のもの。

10、30,31行目の記述が、フォントのカラーを定めているので、ここを好きなフォントカラーに変更する。

とりあえず、しばらく様子見。

========

以上の様な方法の他に、
直接、id=”recent_comments”の内容をいじくっても、同様の効果があるはず。

※この話はArthemia Premium (ver1)に関してのものです。