キャプション付き画像の余白を変更する

WordPressでは、キャプションを画像に設定すると、コアモジュールにより左右に余白ができるようになっています。
記事投稿画面のHTMLコードとしては、[caption]というカスタムタグで囲まれ、この部分のstyleは好きに触る事ができません。
この部分は、wp-includeのmedia.phpに書かれています。

WordPressのバージョンによって行数には違いがあるでしょうから、

  • img_caption_shortcodeというfunction名
  • wp-captionというclass名
  • style=

などの文字列でmedia.phpを検索して以下の記述を見つけてください。

return '<div ' . $id . 'class="wp-caption ' . esc_attr($align) . '" style="width: ' . (10 + (int) $width) . 'px">'
. do_shortcode( $content ) . '<p class="wp-caption-text">' . $caption . '</p></div>';

この部分のstyle=width:の後にある(10 + (int) $width)の10+の部分をお好みで変更します。
$widthは、画像本体の横幅が入ります。

なぜこのようなコーディングがされているのかは謎ですが、追加幅は0にしておき、wp-captionクラスに対してmarginを設定するのが一番スマートな使い方な気がします。

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

この投稿へのトラックバック

  1. […] 参考サイト:「キャプション付き画像の余白を変更する:APPOFIT」 Search […]

トラックバック URL