attention admin about comments trackbacks you may also like

コメント投稿者アイコン

2020年01月04日
ブログいじり
2

昨年、テンプレートを変更して、コメントでコメントした方のご自身のブログのURLを書いていただくとプロフイール画像が表示されるのですが、これは、テンプレート作者の方の仕様ではないんですね。

下記のブログ様を参考にしました。

FC2ブログの訪問者コメントで、自動で訪問者ごとにユーザーアイコンを表示してみました。

同じFC2ブロガーがログイン状態でコメントを書き込んでくれたとしても、管理者以外のコメント者を判別するようなシステムとなってはおらず、テンプレート変数などによ...

コメントした方が、ご自身のブログのURLを書いていただくと、自動でプロフィール画像が表示される仕様です。しかし、URLを書かないでプロフィール画像が表示されない場合は、少し、無粋ですよね。

コメント投稿者がURLを書かなかった場合、コメント表示枠だけの写真

テンプレートの作者がなぜ、このような仕様にしているか分からないのですが、コメントをくれた方がそのURLを書かなければ、プロフィール画像枠自体を表示しない様にしてみました。

プロフイール画像枠を消した写真

自分のプロフィール画像はURLを書かなくても自動で表示される仕様なのですが、ここは、プロフィール画像からファビコン画像に変更しています。

<!--comment_author-->
<img class="lazyload author-icon" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="https://onga.sakura.ne.jp/gazou/191218-02.png" alt="遠太のエコボランティアブログのファビコン画像">
<!--/comment_author-->

ここまでで、終わる話だったのですが、過去記事のコメントで私のファビコンが表示されていない・・・

調べてみると、以前、管理人名は、「遠太」ではなく、「遠太(おんた)」だったんですね。あくまでも、その記事を投稿した時点での内容で、その以後もそれが反映されるみたいで、もう、どうしようもないみたいです。

そこで、以前の化石級固定幅テンプレートで使用していた手法で対応しました。

コメント欄の背景画像でファビコン画像を表示させる手法です。コメント投稿者名のクラス名で、その要素の背景画像としてファビコン画像を表示させています。 位置調整はもう少し、スマートに記述できるかと思いますが・・・

HTML
<!--comment_author-->
<!--/comment_author-->
<div class="<%comment_name>"></div>
<p class="comment-title <%comment_name>A"><%comment_title></p> <p class=comment-body><%comment_body></p>

CSS
.遠太{
background-image:url(https://onga.sakura.ne.jp/gazou/191218-02.png);
background-repeat: no-repeat;
background-position:center left;
background-size:contain;
width:50px;
height:50px;
margin:0 0 0 -24px;
}
.遠太A{
margin-top:-35px;
}

<div> と</diV>の中に何もなくてもエラーにならないのはラッキーでした。

関連する記事
遠太
Author: 遠太
九州は福岡県中間市で環境保全や地域に関するボランティア活動中。
できる時にできる範囲で。そこには、ノルマも強制も義務もありません。

コメント(2)

There are no comments yet.

ミドリノマッキー  

2020/01/06 (Mon) 11:10

どういうやり方で出せるのか分かりませんが、自分の画像が出ているのを見れるのは嬉しいものです(^^♪
それに自分の位置が一目で分かるのも有難いです。

遠太  

2020/01/06 (Mon) 17:55

ミドリノマッキーさん、こんばんは。

コメント者のプロフィール画像が表示されるのは、私も余り分からないのですが、不安定な部分もあるみたいです。
稀に、表示されなかったり、記事中の画像が表示されたりしますが、そこは愛嬌で。
いつもコメントありがとうございます。