[ a-blog cms ] 画像の縦横比を変更するリサイズはできない #ablogcms

スポンサードリンク

カスタムフィールドでアップロードした横長画像から、正方形のサムネイル画像を生成する方法がわからず Twitter で尋ねてみた所、次のような返信がありました。

Twitter

@kazumich 様、@uchibo 様、返信ありがとうございます!

横長画像から正方形のサムネイルを表示する方法

a-blog cms は画像の縦横比を変更するようなリサイズはできないと言う事で、サムネイル部分は次のようなコードで表示することにしました。

画像を指定サイズに縮小して表示し、はみ出た部分は CSS の overflow:hidden で隠します。

<div style="width:{x}px; height:{y}px; overflow:hidden;">
<img src="%{ARCHIVES_DIR}{Thumb@path}" height="{y}" />
</div>

また、もうひとつの方法として、jquery.MyThumbnail.js と言う jQuery プラグインを使った方法もあるようです。

今回の環境

  • a-blog cms 1.4.2

参考にさせてもらったページ

縦横比を保ったままの縮小画像は生成できるようです。

スポンサードリンク

この記事が気に入ったら、ぜひシェアをお願いします!

コメントを残す

メールアドレスが公開されることはありません。

ABOUTこの記事をかいた人

Mac, iPhone, WordPress が好きなウェブディレクター。 香川県坂出市出身。香川県高松市在住。 1973 年生まれで三児の父。川添おやじの会会長。ネギと玉ねぎが嫌い。