「拍手ボタン」の位置調整

このFC2ブログには、「拍手」という機能があります。
エントリの内容が面白かったり共感したりした時に、ボタンをポチっと押すと、拍手数としてそのエントリへの関心度がわかるというものです。
その「拍手ボタン」の表示位置がどうも気に入らなかったのですよね。今夜、ようやくうまく表示できなかった原因がわかり、位置の調整ができましたので、備忘録としてアップします。

pic20110613_01現象は、左のように、「拍手ボタン」が本文と行間なく表示されて、見栄えとバランスが悪いということです。
pic20110613_02対策として考えたのは、テンプレートで本文(%topentry_body)の後に改行コードを入れるということ。結果は左のようにうまくいきました。
なんだ単純なものだなと思ったのも束の間。
表示を個別エントリ表示に切替えたら・・・
pic20110613_03・・・また本文と「拍手ボタン」との間に行間がなくなりました。
こうなる理由は、通常表示の時は「拍手ボタン」のコードは本文(%topentry_body)のあとの追記表示(%topentry_link)の後に付くので、本文の後にいれた改行が効き、個別エントリ表示の場合は、追記表示がなく本文だけなので、「拍手ボタン」のコードが本文(%topentry_day)直後に含まれ、テンプレートに入れた改行コードがその後に付くからだと推測しました。
私の場合、「拍手ボタン」の表示設定を「追記リンクの後」にしてあるので、そうなったのでしょう。
では、「拍手ボタン」の表示設定を「追記リンクの前」にしたらと思いますが、そうすると、追記のあるなしにかかわらず、「拍手ボタン」のコードは本文(%topentry_body)直後に含まれ、テンプレートに入れた改行はまったく効かなくなります。
pic20110613_04そこで、ソースコードをチェックして、「拍手ボタン」がどういう形で入っているのかを確認しました。
そうすると、スタイルクラスが「fc2_footer」となっています。
このクラス、私の使っているテンプレートには定義されていません。
pic20110613_05ということがわかれば、答えは簡単。
最初からソースコードを見ていればもっと早く解決したかもしれません。
テンプレートのスタイルシートに「fc2_footer」を定義し、上の行とのマージンを20ピクセルとなるよう記述しました。
その結果が左。
pic20110613_06個別エントリ表示にしても大丈夫。
これでずっと気になっていた「拍手ボタン」の位置の調整ができました。
めでたし、めでたし。
それ以前に、「拍手ボタンなんかいらねぇんじゃねぇ?」という声も聞こえてきます。「いや、そうじゃないぞ」と言えるためにも、ポチっと押していただければと思う次第です。

コメント