”シンプル”なデザインを、”フツー”のWEBサイトを

WordPressで記事内に画像を挿入するとき、多くの場合は「メディアを追加」から操作を行うかと思います。

差し込みたい画像を選択するだけで良いので非常に便利なのですが、この操作で画像を挿入すると、<img>に「class=”alignnone size-full wp-image-1380″」というようなclassが自動的に付与されます。

このメディア追加の際に自動的に付けられてしまうclass名を、任意のものに変更する方法を今日は紹介します。意外と役立ったりしますので、覚えておいて損は無いかと。もちろん、プラグインは使いません。

functions.phpにちょっと追記するだけ

WordPressのフィルターフックというものを使うだけで簡単に実現出来てしまいます。プラグインなんかもありそうですが、もしかしたらそちらより簡単かも知れません。

ということで、functions.phpに下記を追記してください。

function image_class_filter($class)
{
  $class = 'sample';
  return $class;
}
  
add_filter('get_image_tag_class', 'image_class_filter');

上記コード内の「sample」となっている部分が、挿入した画像に付与されるclass名になります。これだけです。これでCSSで自由にスタイリングすることもできるので、結構使える小技です。

他にも色々方法はあるようなのですが、ビジュアルエディタで編集すると指定したclass名がきちんと反映されなかったり、あまり使い勝手がよくないものもありました。なので、今のところこれがベストかと思っています。