コメントプロフ画表示scriptをバージョンアップ報告板 | AmebloEnjoyMethod

AmebloEnjoyMethod

アメブロカスタマイズ情報やhtmlやcss、jQuery等やライフハック記事をお届けしています。





現在はこちらのscriptを使用させていただいています。
コメント欄にプロフィール画像を表示させたい方は
びんごぼんごさんのブログ【blog lab】へどうぞ。

【新スキン対応】コメント欄にプロフ画像を乗せるプラグイン|blog lab 【アメブロカスタマイズとネタ話】


アメブロのコメント欄に、自動でコメント者のプロフィール画像を表示するscriptをちょっとだけバージョンアップしました。


今後の変更点の報告等は、この記事でしていく事にします。

このコメントscript以外にも、アメブロ内でこんな事がしたい!とかあったら
この記事のコメント欄かメッセージにて報告お願いします。
出来るようだったら、頑張って作ってみます。

出来ない場合は出来ない!ときっぱり言いますw

設置方法は以下のURLから
アメブロのコメント欄に自動でプロフ画を表示させる方法

※1/28 ローディング画像付与、コメント欄の文章の回りこみを調整できるようにしました。

変更点


変更点は下記の通り
1、ローディング画像を表示させるようにした。

ページを読み込んで、プロフィール画像の取得が遅い場合、何も表示されていないと物足りないので付けました。

2、文章部分のデザインを弄れるようにしました

以前までの表示では、文章が画像の下に回りこんでいました。


※画像はミスアラさんのブログのコメント欄の表示を使わせて頂いています。
見やすいブログカスタマイズで10万円獲得計画~ミスアラのアメブロシンプルカスタマイズ(CSS)

現在ではCSSの調整によって下記のように出来ます。
borderを付けたり、背景画像を付けたりしてカスタマイズしてみてください。



下記CSSで文章部分の位置を調整できます。
画像サイズを変更している方は、marginの値を調整してください。
100pxの数値を変えて、調整してください。


div.commenttext{
margin-left:100px;
}


また、floatをrightにしている方はmargin-rightの値で調整してください。

div.commenttext{
margin-right:100px;
}



現在の問題点や追加しようか悩み中のもの

問題点
現在の問題点は、プロフィール画像を取得する為に使っているYQL。
何が原因かはっきりしていませんが、時々動作しなくなります。
YQL側の障害なのだろうか?

原因が障害の場合は時間が経てば、元通りに表示されるようになります。

ちなみにYQLが何らかの影響で使えない状態の場合は
ローディング画像が表示されたままになります。
追加しようか悩み中の機能
このブログのコメント欄では悩み中の機能を付けています。

現在は、ペタがすぐ出来るように、コメント者へのペタリンク。
要望が多ければこれ追加します。


追加予定・出来れば追加したい機能

・コメントに対する返信(レス)を見やすくする為に、2ちゃんねる風に
・プロフィール画像になんかのアニメーション。