WordPress で記事内に画像を挿入すると、画像のすぐ下にキャプションという形で好きな文字を表示させることができます。
くま五郎
オトマミ
ということで、WordPress で画像のキャプションに表示させる文字サイズを変更する方法を紹介します。
WordPress で画像のキャプションに表示させる文字サイズを変更する手順
プラグイン TinyMCE Advanced などを使って投稿画面を昔のバージョンへ戻している場合には、普通に文字サイズを変更することができます。
ただ、WordPress 5.0 以降に導入された Gutenberg では、画像のブロックを選ぶとキャプションを入力する欄が表示されるのですが、文字サイズを変更することが現状ではできません。
オトマミ
そのため、表示される文字が大き過ぎると思っている人、または小さいと思っている人は、CSS を追加することで全てのキャプションの文字のサイズを変更させることができます。
文字サイズを変更させる CSS
文字サイズを変更させたい場合には、「外観 > カスタマイズ > 追加 CSS」から下記を追加してみてください。
.wp-block-image figcaption{
font-size: 12px;
}すると、キャプションに入力した文字が 12px の大きさで表示されるようになります。
もし、もっと小さくしたい場合には 12px の値を小さくして、逆に大きくしたい場合にはもっと大きな数字を設定すれば OK です。
文字を表示させる位置を変更した場合
キャプションの文字は、テーマによって位置がデフォルトで中央になっていたり左寄りになって表示されます。
もし文字の位置を変更したい場合には、下記を先ほどのコードに追加してあげます。
text-align: 位置;位置には、「left」「center」「right」のいずれかを設定します。
もし、文字を 12px の大きさに変えて左寄りに表示させたいとするならば、下記のようになります。
.wp-block-image figcaption{
font-size: 12px;
text-align: left;
}あわせて知っておきたい情報
WordPress で、とういうか Gutenberg の管理画面で画像のキャプションに表示させる文字サイズを変更させる方法の解説は以上となります。
この記事とあわせて、知っておくと便利な情報を紹介しておきます。
Gutenberg の管理画面が使いにくいと思った人
WordPress 5.0 のエディタを変えるプラグイン３つを紹介【無効化できます】 WordPress 5.0 より Gutenberg という投稿画面に変わったことから、既存のユーザーはもちろんのこと、他のブログサービスを利用していた人からは使いにくいという意見がたくさんあがりました。
そこで、従来の投稿画面であり、他のブログサービスと同じような画面にするためのプラグインが３つあります。
これから WordPress と長い付き合いになると思っている人は Gutenberg に慣れるほうが良いかもしれませんが、なにせ記事を投稿しないと話になりませんからね。
Gutenberg に慣れるまでは、旧バージョンの投稿画面で投稿するのもアリでしょう。
画像を最適化して SEO 対策
次世代フォーマットでの画像の配信【解決してWordPressを高速化】 WordPress 5.3 より、自動で画像を小さくリサイズされるようになりました。その理由としては、大きい画像はそれだけページの表示速度に影響するからです。
表示させたい画像をただアップロードして表示させていたという人は、画像の最適化をして SEO 対策してみましょう。
さいごに
Gutenberg はまだ発展途上なところもあるので、正直なところ使いにくい箇所も多々あると思います。
WordPress 5.3 のアップデートでは大幅な変更もあったりもしたので、そのうち画像のキャプションについても自由に変更できる日が来るかもしれませんけどね。