記事に画像を使うとき少しでも綺麗に見せたいですよね。
というわけでまずは下の2枚の画像を見比べてください。


いかがでしょうか?下のほうが綺麗じゃありませんか?
こんな影を自動でつけてくれるのが今回紹介するプラグインが『shadow』です。
このプラグインはつけれる画像を4つの中から選ぶことができます。
shadow_curl

shadow_flat

shadow_osx

shadow_osx_small

僕は、shadow_osxを使っていましたがなんでもいいと思いますよ。使い方は、画像を差し込む際にそのソースコードにクラスを追加してあげればOKです。
例えばshadow_osx_smallを使いたい場合は、
通常は<img src=”画像URL”width=”500px”>というところを
<img src=”画像URL”width=”500px” class=”shadow_osx_small”>
という感じにすればOKです。
応用編
コアファイルをいじると、自動で毎回クラスを追加してくれて自動で影を追加してくれるように設定できます。
「wp-includes/media.php」を開き、以下の箇所を変更します。
media.php 231行目ぐらいの
[css]$html = ‘<img src="’ . esc_attr($img_src) . ‘" alt="’ . esc_attr($alt) . ‘" title="’ . esc_attr($title).’" ‘.$hwstring.’class="’.$class.’" />’;[/css]
を
[css]$html = ‘<img src="’ . esc_attr($img_src) . ‘" alt="’ . esc_attr($alt) . ‘" title="’ . esc_attr($title).’" ‘.$hwstring.’class="’.$class.’ 『好きなクラス名』" />’;[/css]
に変更してください。好きなクラス名には追加したい影のクラス名を入れてください。
[…] Shadows […]