【はてなブログカスタマイズ】見たまま編集のB（強調）を、蛍光マーカー風にデザインしました
これまで、大見出し、中見出しのデザインカスタマイズをしてきました。
今回は強調文字のカスタマイズです！
目次
強調文字を蛍光マーカー風にする
はてなブログの見たまま編集画面で「B」の設定をすると
HTML編集では<strong>と設定されます。
今回のカスタマイズをすることで、ブログ内の<strong>の箇所が一気にデザインされます！
参考記事
参考はこちらの記事。
こちらでは、太いマーカーと細いマーカーが紹介されていますが、私が採用したのは細い方。なので、下記のコードを使います。
marker_yellow_hoso {
background: linear-gradient(transparent 60%, #ffff66 60%);
}
コードを修正する
今回は<<strong>の箇所をデザインするので、コードの“marker_yellow_hoso”の部分は“strong”に書き換えます。
色も、濃い目の黄色にしたかったので、#ffff66の部分を#E4DE31に書き換えました。
※色コードの確認はこちら
完成したコードが下記です。
strong{
background: linear-gradient(transparent 60%, #E4DE31 60%);
}
はてなブログに設定する
完成したコードをはてなブログに設定します！
コードをそれぞれ貼り付けした後は、「変更を保存する」をクリックするのも忘れずに。
PC版
デザイン→カスタマイズ→デザインCSSの箇所に貼り付け。
すでに大見出しや中見出し、文字サイズのコードが貼られていると思うので、その下に貼り付けます。
スマホ版
デザイン→スマートフォン→記事→記事上の箇所に貼り付け。
こちらにも、大見出し、中見出し、文字サイズのコードが貼られていると思うので、その下に貼り付けます。
ビフォーアフター
この設定で、ブログ内の<strong>がすべてこのデザインになります。
使うのは3個まで！
この強調タグは、見た目にも「大事なところだよ！」と分かる重要な部分ですが、検索上位をあげる為（SEO対策）的にも大事だと言われています。なので、
ここぞという時に強調タグを使うようにしましょう。
私的には、1記事に1個～多くても3個くらいまでに抑えたほうがいいと思っています。
さいごに
色をつけることで読者も読みやすくなるし、ブログも見た目的にもSEO的にもレベルアップすることができます。
5分くらいでできるので、ちゃちゃっとやってしまいましょう^^
