TinyMCEでアップした画像にloading=”lazy”を追加する

[talks text=’

extended_valid_elementsで上書きするのが一番楽

‘]

以下のコードを、

extended_valid_elements: 'img[class|src|alt|width|loading=lazy]',

こんな感じで追記。

tinymce.init({
  selector: 'textarea',
  extended_valid_elements: 'img[class|src|alt|width|loading=lazy]',
  ～以下略～
});

設定後、スマホでエディター内の画像が表示されなくなる可能性あり。その場合は表示直前にPHPで処理する方法がおすすめ。

echo str_replace('<img', '<img loading="lazy"', $your_var);