Proxomitronで画像のリサイズ

質問

Proxomitronを使って、リンク先のイメージをサイズを指定して表示してしまうフィルターが以下のフォーラムで紹介されていました。

http://my.opera.com/lounge/forums/topic.dml?id=76301&page=1&skip=0&show=&perscreen=50

Name = "Show linked images in forums - Thumbnail Size [Tamil]"
Active = FALSE
Multi = TRUE
URL = "$TYPE(htm)"
Bounds = "<a*"
Limit = 512
Match = "<a href=($AV(attachment.php\?*))\1*.(bmp|gif|jpeg|jpg|png)"
Replace = "<a href=\1><img src=\1 width=250 height=250 border=1 vspace=5 hspace=5 alt="Linked image">"

そこで同様な感じで、フォーラムサイトなどでレイアウトを壊してしまうような大きな画像を幅640px以下に縮小させて表示させることは可能でしょうか？

ご存知の方おられましたらよろしくお願いします。

回答No.2

aqucent · ベストアンサー

えーと…、メタキャラクタやマッチングコマンドの使い方について理解されているでしょうか？
特殊文字の使い方がやや怪しいです。

> URL = "$TYPE(htm)&$AV/forums/"
$TYPE(htm) は合っていますが、残りは違います。
$AV は属性値にマッチさせるコマンドですので、ここでは使いません。
結論としては、URL = "$TYPE(htm) */forums/" となるでしょう。
(& を入れたくなる気持ちはわかりますが、URLマッチでは不要です)

> 2. "Shrink Large Images"
改善点は以下のように。

・Limitが必要以上に多い(256で十分)
・括弧で二重に括られている(1つ要らない)
・height属性を挿入する必要がある
・src属性値にマッチさせる表現がない(置換テキストのsrc属性値が空欄になる)

ところで、widthの値が 1601 を超えるサイトがあるんでしょうか？
1601ピクセルとなると、SXGAクラスでも画面の大きさを超えるので、普通は(サイト側で)リサイズすると思うんですが…。

> Matchの部分で改行している意味がよくわからないです。
Proxomitronは改行を解釈しませんので、コードの視認性を確保するために、改行を挿入することがあります。
HTMLソースで改行を加えるのと同じ理屈です。

> imgの widthなどを設定していない場合、2のやり方だと、画像のリサイズはできないような気がします。
そうですね。width指定がない場合は、2. のフィルタがマッチしません。

> 3. "Replace to a Linked Thumbnail"
改善点は以下のように。

・Limitが必要以上に多い(256で十分)
・Multi は不要
・Bounds を <img\s*> に
・検索表現に src= を挿入(src属性値に制限)
・a要素が終了タグで閉じられていない

ただですね。
"Replace to a Linked Thumbnail" は強制的に画像サイズを「250px×250px」にするので、縦横比が「1対1」の画像でなければ、横長か縦長の画像になってしまいます。
forumで画像リサイズするなど、用途にあったサイトでだけフィルタを有効にする方が賢いかと思います。

後は、変数と & の使い方を覚えれば、フィルタを作れると思います。
頑張ってください。(^^;
http://www.pluto.dti.ne.jp/~tengu/proxomitron/help/Matching_Rules.html

参考URL：

http://vird2002.s8.xrea.com/proxomitron/db_matching_rule.html#local_var

お礼

ありがとうございます。

ちょっと自分には難しすぎるようです。

もっと基本的なことから始めようと思いました。

また質問しますのでよろしくお願いします！

回答No.1

aqucent

まさか、OKWaveでProxomitronの質問があるとは…(笑

> フォーラムサイトなどでレイアウトを壊してしまうような大きな画像を幅640px以下に縮小させて表示させることは可能でしょうか？
結論からいいますと、可能です。

紹介されたフィルタのポイントは "width=250 height=250" の部分です。
imgタグは画像を読み込むタグですが、width属性(幅), height属性(高さ) を指定することで、画像の縦横の長さを指定できるのです。
ですので、width属性, height属性 の値を変更することで、画像の大きさを好きなように変えることができます。

これをヒントにしてフィルタを作ればよいかと思います。
訪問者としては元のサイズの画像も閲覧したいと思われますので、a要素を使って、画像ファイルにリンクを貼っておくと良いかもしれませんね。

参考URL：

http://www.scollabo.com/banban/senior/ref/ref_i.html#i-img

補足

自分で色々と試行錯誤してみているのですが、なかなかうまく行きません。以下、いくつかわからないところがあります。

１．まず、URL値なのですが、フィルターをforumsというディレクトリを含むURLすべてに適応させたい場合、

URL = "$TYPE(htm)&$AV/forums/"

という感じになるのでしょうか？

２．こちらの（↓）サイトで”Image Size Limitter”というフィルターが紹介されていましたので参考にさせてもらいました。　
http://www.pluto.dti.ne.jp/~tengu/proxomitron/newfilters.html

Name = "Image Size Limiter (2003/05/18)"
Active = TRUE
URL = "(^[^/]++.yahoo.com)"
Bounds = "<img\s*>"
Limit = 1024
Match = "<img\s("
"(*width=[#1601:*] & *height=[#1201:*])"
"|(*(width=[#1:3])\1 & *(height=[#1:3])\2)"
")*>"
Replace = "<!-- Limited Size Image -->"
"<img src=http://Local.ptron/killed.gif border=0 \1 \2>"

これを以下のような感じに変えるとよいのでしょうか？Matchの部分で改行している意味がよくわからないです。

Name = "Shrink Large Images"
Active = TRUE
URL = "$TYPE(htm)"
Bounds = "<img\s*>"
Limit = 1024
Match = "<img\s("
"(*width=[#1601:*] & *height=[#1201:*])"
")*>"
Replace = "<img src=\1 width=680 alt="Shrinked image">"

３．また、フォーラムサイトでの画像は主にユーザーがアップロードしたものが多く、その際にサイト側で、imgの widthなどを設定していない場合、２のやり方だと、画像のリサイズはできないような気がします。どうなのでしょう？

そこで思いついたのですが、画像の大きさ如何に関わらず、表示された画像をサムネイルとして表示し、オリジナルをリンクする、という方法なのですが、以下のようにしてみましたが、うまくいきません。

Name = "Replace to a Linked Thumbnail"
Active = TRUE
Multi = TRUE
URL = "$TYPE(htm)"
Bounds = "<img*"
Limit = 1024
Match = "<img=($AV(*.(gif|jpeg|jpg|png)))\1*"
Replace = "<a href=\1><img src=\1 width=250 height=250 alt="Thmbnailed image">"