投稿本文のメディアから追加する画像のタグに自動的にclassを追加したい



本文の「メディアを追加」から、リンクを有りで画像を追加すると、


<a href="指定した画像のリンク先"><img src="画像の保存場所" width="300" height="90" class="alignnone size-medium wp-image-1" /></a>

のようなコードが本文に挿入されます。

今回は、このhtmlのタグに、classを追加したい、と。
リンクがある場合は、aタグがあるので、aタグ、imgタグの両方にclassを追加、リンクがない場合はclassの追加はなしという要件。

調べてみると、意外とすぐに見つかったのが、このフック、image_send_to_editor。

ということで、functions.phpに、コードを追加。

//画像を投稿に挿入する際のタグの変更
function give_linked_images_class( $html, $id, $caption, $title, $align, $url, $size ) {
  $str_a = '<a href';
  if(strstr($html, $str_a)){
    $str_a_class = '<a class="aaa" href';
    $html = str_replace($str_a, $str_a_class, $html);
    $str_img = '" /></a>';
    $str_img_class = ' bbb" /></a>';
    $html = str_replace($str_img, $str_img_class, $html);
  }
return $html; 
} 
 
add_action( 'image_send_to_editor', 'give_linked_images_class', 10 ,8);

imgタグの方は、すでにいろいろclassが追加されてたので、後ろにくっつけました。

出力されたhtmlはこちら。


<a class="aaa" href="指定した画像のリンク先"><img src="画像の保存場所" width="300" height="90" class="alignnone size-medium wp-image-1 bbb" /></a>

以下、お世話になったサイト

その後、heightも消したいということで、preg_replace()を使って、正規表現でごにょごにょ消しました。正規表現、久しぶりに使ったわー。

またまた、使うシーンがあまりなさそうなネタですが、備忘録として。
おしまい☆

投稿本文のメディアから追加する画像のタグに自動的にclassを追加したい」への3件のフィードバック

  1. yamamoto

    ありがとうございます。このコードのおかげでずっとしたかった事ができました。

    返信

コメントを残す

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