WordPressの画像キャプションとメディア説明文を、Imageブロックから直接調整。

Image Caption Styleは、WordPress標準のImageブロックに、キャプションとメディア説明文のスタイル・配置調整機能を追加する軽量なプラグインです。

CSSを書くことなく、独自の画像ブロックに置き換えることもなく、ブロックエディターから直接キャプションと説明文を調整できます。

買い切り · 1サイト – $12

キャプションと説明文をまとめて調整

Image Caption Styleを有効にすると、WordPress標準のImageブロックに「Caption & Description」パネルが追加されます。

キャプションの文字サイズを調整できるほか、画像のメディア情報に登録されている説明文(Media Description)を表示できます。

キャプションと説明文の文字サイズはそれぞれ個別に設定し、配置、横幅、間隔、文字色などは共通して調整できます。

すべての操作はブロックエディターから直接行えます。

メディアの説明文を画像と一緒に表示

WordPressのメディアライブラリでは、それぞれの画像に「説明」を登録できます。

Image Caption Styleでは、このメディア説明文をキャプションと一緒に表示できます。

Imageブロックで「Show Description」を有効にするだけです。

説明文にはメディアライブラリに登録されている内容を使用するため、同じ画像を使用するたびに文章を入力し直す必要はありません。

Below / Overlay

キャプションと説明文は、画像の下に表示することも、画像の上に重ねて表示することもできます。

選択できるのは、

Theme
Below
Overlay

の3種類です。

「Theme」では、現在使用しているWordPressテーマの表示に任せます。

「Below」では、画像の下にテキストを配置します。

「Overlay」では、キャプションと説明文を画像上の任意の位置に配置できます。

Overlayの位置を視覚的に調整

「Overlay」を選択すると、「Overlay Position」からテキストの表示位置を視覚的に調整できます。

ポイントを動かすことで、画像のどこにキャプションと説明文を配置するかを決められます。

キャプションと説明文は同じ位置を基準として、一つのグループとして移動します。

画像ごとの構図に合わせて配置できるため、あらかじめ決められた位置に限定されません。

また、スマートフォンなどの狭い画面では、横方向の位置指定とテキスト幅を自動的に調整。テキスト領域を画像幅に合わせ、左右に余白を確保したレイアウトへ切り替わります。

テキストの横幅と間隔を調整

Overlayでは、テキストを必ずしも画像いっぱいの横幅で表示する必要はありません。

「Text Width」で、キャプションと説明文のテキスト領域の横幅を調整できます。

「Text Gap」では、共通のOverlay Positionを維持したまま、キャプションと説明文の間隔を調整できます。

変更内容はブロックエディター上で確認しながら調整できます。

配置と文字色を共有

キャプションと説明文の文字配置は、

Left
Center
Right

から選択できます。

Overlayでは文字揃えだけでなく、選択したOverlay Positionを基準として、テキスト領域のどの位置を基準点に合わせるかも連動します。

文字色もキャプションと説明文で共通して設定できます。

一方、文字サイズはそれぞれ個別に設定できるため、キャプションと説明文に視覚的な差をつけることができます。

WordPress標準のImageブロックをそのまま使用

Image Caption Styleは、独自の画像ブロックを追加するプラグインではありません。

WordPress標準のImageブロックをそのまま拡張します。

そのため、WordPress本来の画像機能を維持したまま、必要な機能だけを追加できます。

専用の設定画面もありません。

プラグインを有効化したら、

  1. Imageブロックを追加、または選択
  2. ブロック設定の「Caption & Description」を開く
  3. キャプションと説明文を調整
  4. エディター上で表示を確認

これだけです。

Features

  • WordPress標準のImageブロックに対応
  • キャプションの文字サイズ調整
  • メディア説明文の表示/非表示
  • キャプションと説明文それぞれの文字サイズ調整
  • Left / Center / Rightの文字配置
  • Below / Overlayの表示位置
  • Overlay Positionによる視覚的な位置調整
  • キャプションと説明文の共通配置
  • Overlay時のテキスト横幅調整
  • キャプションと説明文の間隔調整
  • スマートフォンでのOverlayレイアウト自動調整
  • 文字色の変更
  • 文字サイズ・配置のTheme設定
  • ブロックエディターでのライブプレビュー
  • 独自の画像ブロック不要
  • 専用設定画面不要

Requirements

  • WordPress 6.2以降
  • PHP 7.4以降

Price

$4.97

買い切り · 1サイト。

Version

Image Caption Style 0.1.0