『読者になると、このブログの更新情報が届きます。』を太字や大きい文字サイズにして目立たせる方法

『読者になると、このブログの更新情報が届きます。』を太字や大きい文字サイズにして目立たせる方法

こんにちは、松本です。

今回はアメブロカスタマイズの記事です。

先日、読者登録ボタンの上下にメッセージを表示する方法というのを紹介したんですが、その際、コメントで、

「更新情報が届きますって文字を赤字でもう少し太くしたい」

というご要望がありましたので、今回、その方法をご紹介したいと思います。

赤文字・太字で文字サイズも大きくする

では、実際の方法です。

『読者になると、このブログの更新情報が届きます。』を赤文字、太字で文字サイズを大きくするには、

ユーザーCSSに以下のような設定を追加して下さい。

ユーザーCSSについてわからない場合はこちらを参照してください

/* 『読者になると、このブログの更新情報が届きます。』を目立たせる */
.readerMenu .readerRequestDescription {
  font-weight: bold; /* 文字を太字に */
  font-size: 14px/* 文字サイズ */
  color: #ff0000; /* 文字色を赤に */
}

文字サイズ14pxは、仮にこの大きさに設定していますが、ご自身のブログのサイドバーの幅に合わせて、もっと大きくしたい場合は数字を大きく(16pxなど)、小さくしたい場合は数字を小さく(12pxなど)に調節して下さい。

このブログの場合は

また、参考に本ブログの設定もご紹介しておきます。

この記事を書いている時点で、本ブログの『読者になると、このブログの更新情報が届きます。』は、

セリフ付き(≒明朝体)、太字、文字を大きく、濃いめのオレンジ、影付き

という設定なんですが、次のようなCSSになっています。

/* 『読者になると、このブログの更新情報が届きます。』を目立たせる */
.readerMenu .readerRequestDescription {
  font-family: serif;/* セリフ付き */
  font-weight: bold;/* 太字 */
  font-size: 14px;/* 文字サイズ */
  color: #ee7800;/* 濃いめのオレンジ色 */
  text-shadow: 1px 1px 0 #ffffff, 2px 2px 0 #dddddd;/* 文字の影 */
}

同じか、近い表示にしたい場合はこちらを使っていただいてもOKです。

表示内容を変更したい場合

あと、『読者になると、このブログの更新情報が届きます。』という表示内容(文)を変更したい場合は、この文字を非表示にした上で、読者登録ボタンの上下にメッセージを表示する方法で、ボタン下にメッセージを表示するといいと思います。

『読者になると、このブログの更新情報が届きます。』を非表示にするには、以下をユーザーCSSに追加すればOKです。

/* 『読者になると、このブログの更新情報が届きます。』を非表示に */
.readerMenu .readerRequestDescription {
  display: none;
}

以上、『読者になると、このブログの更新情報が届きます。』を太字や赤文字、大きい文字サイズにして目立たせる方法を(ついでに消す方法も)ご紹介しました。

ブログ訪問者へのアピールに役立てて頂ければと思います。

よかったら参考にして下さいね。

関連記事

CSSを編集してアメブロをカスタマイズする方法
アメブロカスタマイズ目次

アメブロカスタマイズと読者を増やすブログ運営