WordPressで太字を使うとBoldではないことに最近気づきました。太字ボタンを押してテキストモードで見てみると「strong」になっています。
しかし、各見出しごとにキーワードや強調したいことがあるということもありますよね。そういうときはBoldを使うことで対応することが可能です。
Boldタグを手打ちするのが面倒という人は「AddQuicktagプラグイン」で対応しましょう。
テキストモードで装飾を確認するとStrongタグが使われています
目次
Strongは検索エンジンにも影響。多用すると逆効果
今回は、Strongの代わりにBoldを使用して太字を使えるようにします。
StrongとBoldでは何が違うかというと、検索エンジンへの影響の有無です。
Strongは検索エンジンにもキーワードとして評価されるのに対し、Boldは人がブラウザで見たときに変化している見た目だけの変更です。
それならStrongの方が良いのでは?と思いがちですがこれがまた厄介なところでStrongを使いすぎると今度は検索エンジンに「評価されようとStrongを多用する迷惑サイト」扱いされることがあり、かえって検索順位から落とされてしまうことがあります。
なので強調は1記事に数カ所に留めておくのが良いのですが、大事なところは強調したいものです。
シュウ
Boldタグの設定と動作確認
Boldタグを手打ちするのは面倒なので、AddQuicktagプラグインを使って新しい太字用ボタンを作ってみます。
AddQuicktagプラグインがインストール済みであることが前提ですので、インストールしていない人はAddQuicktagプラグインをインストールしてから進んでください。
AddQuicktagの設定
style.cssの編集
次にstyle.cssにさきほど設定したspanタグの内容を追加します。
子テーマがあるテーマを使っている方は子テーマ側に追加してください。
.futoji {
font-weight: bold;
}
AddQuicktagで太字になるか確認
これでAddQuicktagで「太字」が使えるようになったので使ってみるとこのようにspanタグが追加されています。
プレビューでも太字になっていることが確認できます。
style.cssに書き足せば、蛍光色も可能
これを応用すると蛍光色とかをつけたりすることもできるようになります。
例えば黄色い蛍光にしたいときは以下のようにします。
.futoji {
font-weight: bold;
background: linear-gradient(transparent 70%, #ffff66 40%);
}
青くしたいときは以下のとおりです。
.futoji {
font-weight: bold;
background: linear-gradient(transparent 70%, #CEE3F6 40%);
}
赤くしたいときは以下のとおりです。
.futoji {
font-weight: bold;
background: linear-gradient(transparent 70%, rgb(255, 170, 170) 40%);
}
futojiに定義するのではなく、keikoなど別の名前をつけることで使い分けることも可能です。
色々応用が効くので試してみてください。
AddQuicktagの設定が用意されているテーマもあります
AddQuicktagの一括登録用に設定が用意されているテーマもあります。
内容が重複している場合は手動で登録する必要がないので、まずは使っているテーマにAddQuicktagの設定があるか確認してみても良いでしょう。
AddQuicktagの設定があるテーマをいくつかご紹介します。
リンク先はAddQuicktagの設定ファイルがある公式ページです。
今日のまとめ
AddQuicktagを使えばspanタグを使うことで太字にすることができます。
普段そんなに使わないのであればWordPressのテキストエディタで直接<b>タグを
使っても良いでしょう。