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

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

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

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

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

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

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

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

[php]

[/php]

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

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

[php]
//追加：disqus用

#recent_disqus {
width:276px;
float:right;
padding:0px;
}

#recent_disqus a {
color:#999;
}

#recent_disqus ul {
margin-top:5px;
}

#recent_disqus li {
list-style:none;
background:url(images/dots_footer.gif) repeat-x top;
padding-top:1px;
}

#recent_disqus ul li a {
padding:5px;
display:block;
text-decoration:none;
}

#recent_disqus ul li a:hover {
background:#000000;
color:#336;
}

#recent_disqus ul li:first-child {
background:none;
}

//
[/php]

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

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

＝＝＝＝＝＝＝＝

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

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