Jquery imgLiquid 様々なサイズの画像を縮小・トリミングして表示

imgLiquid というjQuery pluginが非常に便利なのでWordpressで利用しようと、pluginにしてみました。
imgLiquidについては下記を参考にしてください。

親要素の大きさに合わせて画像をリサイズ「imgLiquid」

WordPressやHTMLでページを作る際のサムネイルなどの大量の処理は非常に面倒です。
頭で希望する通りにやってくれるプラグインなどは殆どありません。
でもimgLiquidはかなりの手助けになるでしょう。特に管理者の手間は間違いなく減らせます。

ではimgLiquidは何をしてくれるかですが、下に書いた画像処理をJavascriptで簡単にやってくれます。

以上です。

これで、どのくらい便利かというと、よくある正方形のサムネイルが無加工で簡単にできてしまいます。もちろん中央に寄る形でトリミングしますので、必要な部分が切れてしまうことがあるかもしれませんが、全ての画像を縮小・トリミングすると考えれば問題ないでしょう（その何枚かに手間を掛ければいいだけですから）。

では、使用例ですが下のようになります。

(1)通常表示 259×194

(2)imgLiquid使用 150×150

以上です。

●使用方法:
<div style=”width:130px; height:130px;”>
<img class=”imgLq” src=”xxx” /></div>

●登録済みスタイル使用方法:
<img class=”imgLq150″ src=”xxx” />
imgLq100 100×100の正方形に表示
imgLq150 150×150の正方形に表示
imgLq150 200×200の正方形に表示
imgLq150 250×250の正方形に表示

細かい設定を追加したり、変更したいときは、/httpdocs/wp-content/plugins/wp-imgLiquid/js/WPimgLiquid.js を修正してください。

ダウンロードは以下。

https://github.com/yukioshibata/WPimgLiquid