【WP】「メディアを追加」で挿入したimgをdivで囲む

 「メディアを追加」で画像を挿入した際、挿入されたimgタグを特定のタグ(div等)で囲みたいと思ったときに使える方法。
※2017/10/23 すみません。ソースに不備があったため修正しました。><

やりたいこと

 通常「メディアを追加」ボタンを使用して画像を挿入すると・・・

<img src="画像URL" alt="代替テキスト" width="幅" height="高さ" class="クラス" />

 ・・・となるのですが。これを・・・

<div class="icimg"><img src="画像URL" alt="代替テキスト" width="幅" height="高さ" class="クラス" /></div>

 こうしたい。

解決法

 function.phpを編集します。

function my_image_send_to_editor( $html, $id, $caption, $title, $align, $url, $size ) {

	$html = '<div class="icimg">' .$html .'</div>';

	return $html;
}

add_action( 'image_send_to_editor', 'my_image_send_to_editor', 10 ,7);

 この一文を足せばOKv
 意外と簡単です♪<\p>  

【WP】「メディアを追加」で挿入したimgをdivで囲む」への6件のフィードバック

  1. たなか

    こんにちは、同じ悩みを持っていたので、参考にさせていただきたいのですが、うまく動きません。
    WordPressの仕様変更かテーマの仕様の問題でしょうか?
    何か解決策など思い当たる節などございませんか?

    返信
    1. fuka 投稿作成者

      初めまして。こんにちは。
      ごめんなさい。思い当たる節がありました!
      add_actionの記述が足りなかったので、サンプルのソースのほうを修正しました。
      最後の一行が増えています。

      返信
  2. いーま

    はじめまして。大変参考にさせていただきました。
    ひとつ困っているのですが、画像の下にタイトルが表示したく
    function my_image_send_to_editor( $html, $id, $caption, $title, $align, $url, $size ) {
    $html = ” .$html .” . $title.”;
    return $html;
    }
    add_action( ‘image_send_to_editor’, ‘my_image_send_to_editor’, 10 ,7);
    のようにしたら出力されるのかなと思ったのですが、pタグ内が空のままなんです…
    どうやったらfunction.php内でタイトルを取得して表示することができますか。
    よろしかったらご教授ください。よろしくお願いします。

    返信
    1. いーま

      function my_image_send_to_editor( $html, $id, $caption, $title, $align, $url, $size ) {
      $html = ” .$html .”” . $title.””;
      return $html;
      }
      add_action( ‘image_send_to_editor’, ‘my_image_send_to_editor’, 10 ,7);

      すみません、コードがきれていました。

      返信
  3. いーま

    function my_image_send_to_editor( $html, $id, $caption, $title, $align, $url, $size ) {

    $html = ” .$html .”” . $title.””;
    return $html

    }

    add_action( ‘image_send_to_editor’, ‘my_image_send_to_editor’, 10 ,7);

    返信
    1. fuka 投稿作成者

       初めまして。参考にしていただけて何よりです^^
       
       コメントに頂いた件につきまして、少々調べさせていただきました。
       ・・・が、難しいかもしれません;
       
       まずWordPressのメディアにある、タイトルは「タイトル=title属性」ではないということです。
      (こちらにもそのような記載がありました。タイトルの項目です。
       https://affilabo.com/wordpress/17409/ (affilabo.com))

       別のサイトなどによると以前は「タイトル=title属性」だったらしいのですが、バージョンが上がった際に画像にtitle属性を付与しなくなったようです。
       引数($idや$title)として来ているのは付与する情報だけなので、結果として付与しなくなったtitleには空が入っているのでないかと思われます。

       一応$altには代替タイトルは入っていたので、そちらを表示することは可能だと思います。
       ・・・解決にならないですかね^^;
      (メディアのタイトルを何らかの方法で持ってくることが可能なのかはちょっとわかりませんでした;
       さすがにできないのかなぁ・・・)

       この程度しかお力になれずすみません。
       私も使っていなかったため$titleが空だと初めて知りました^^;
       
       こちらも勉強させていただきました。
       ありがとうございました。

      返信

コメントを残す

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