読者です 読者をやめる 読者になる 読者になる

マネー報道 MoneyReport

マネーにまつわる報道を取り上げ、自分の切り口で切り取り、噛み砕いてお伝えします。

ブログカスタマイズ「読者アイコンのサイズを大きくしたい!設定方法を大公開!」

スポンサーリンク
あとで読む

昨日の記事がホッテントリ

いやー、昨日は切ない記事をアップしました。

FXトレード記録「大きなミスを犯し投資資金-20%の損失を出す」 - マネー報道 MoneyReport
疲れている時や心理的負荷が大きい時はトレードしない! このルールを破ってしまったばかりに・・・。・゜・(ノД`)・゜・。

FXの投資で思いっきりミスをしまして、投資金額のー20%を失うというのをやってしまいました(>_<)
先月、+20%を達成していたのでトントンなのですが、やはり投資は怖いものだな~、と改めて認識しました(^^;

私は毎月自分のFXトレード記録を公開しているのですが、普段は全然人気のない記事なのですが、今月のトレード記録は後から後から人が来て「なんだろな~?」と思っていたら、はてなブックマークのホッテントリに入っていました(^^;
全然人気なんか出ないと思って書いていた記事が人気が出るとビックリしますね。
投資を志す方の反面教師の良い記事になったのではないかと思います。

読者アイコンサイズをカスタマイズしたい!

昨日の夜に読者登録しているブロガーさん達の記事を1つ1つ読んでいたら、こかげ (id:hinatakokage) さんが下記の様な記事を書かれていました。


どなたか、もし気が向いたら読者アイコンの大きさを変えるCSSを教えて頂けませんでしょうか・・・。又は記事にして頂けませんでしょうか?

今なら確実に需要があります。

な、なんですと!
「確実に需要がある」ですと!?
それなら・・・

MoneyReport - 『ブログのデザインをカスタマイズする時は、変更前のC…』 へのコメント

あ、あ〜、アレですね。ありますよ〜、ウチのブログに♪明日の記事にしますね(^_−)−☆

2014/10/22 23:37 にブックマーク

と、ブコメにて本日の記事の予告を書いて寝ました。
で、今朝早速記事を書いています(^^)w


さて、こかげ (id:hinatakokage) さんがブログカスタマイズでやりたい事として挙げていたのが

はてなブログの自分のブログを読者登録してくれた人の読者アイコンを大きくしたい!

というもの。
これは結構皆さん、思うみたいで以前、異生凡夫 (id:bonpusan)さんもブコメにて書かれていた様な・・・。

ちょっと見てみましょう。
ノーマルの読者アイコンサイズ。
確かにちょっと小さいですよね。

f:id:MoneyReport:20141023070345p:plain

私も元々は小さいままだったのですが、別のブロガーさんがスタイルシートを公開してくれていて、それを利用させてもらって大きくしていました(^^)v
ですが、そのブロガーさんは現在ブログ自体を非公開モードにされてしまっているので、代わりに私の今回の記事にて紹介させて頂きます。

【読者アイコンを大きくするCSS】

.page-about .entry-content img.profile-icon {
    height: 32px; /* 読者アイコン大きく */
    width: 32px; 
}

上記のコードが読者アイコンを大きくするのに必要なコードになります。
コピー&ペーストしてご利用下さい。

張り付ける場所はと言いますと。
「デザイン」→「カスタマイズ」→「デザインCSS」にコードを貼りつけます。
f:id:MoneyReport:20141023070415p:plain


実際にコードを貼りつけたところ。
そして保存して下さい。
f:id:MoneyReport:20141023070523p:plain


そして、「このブログについて」ページに行ってみると、こんな感じに(^^)w
f:id:MoneyReport:20141023070607p:plain

読者アイコンが大きくなって見やすくなりました(^-^)/

あ、読者アイコンの表示が丸くなっていますが、これは私の使っているテーマが丸くしているだけで、上記のコードを貼ってもアイコンサイズが大きくなるだけで大抵の人は四角いアイコンのままですので、ご安心下さい(^^;

もっと読者アイコンを大きくしたい!

え?
もっと読者アイコンを大きくしたい?

じゃあさらに倍!

【読者アイコンを更に大きくするCSS】

.page-about .entry-content img.profile-icon {
    height: 64px; /* 読者アイコン更に大きく */
    width: 64px; 
}

サイズを64pxにアップすると・・・
f:id:MoneyReport:20141023070620p:plain

で、でかい!!!
というかちょっと大き過ぎて全然収まりません(笑)。
でも「俺は大きいのが好きなんじゃ!」という方はこちらのコードを利用されて下さい(^^;