PukiWikiで画像をサムネイルへ差し替える


投稿日:2011年11月5日
  • 2
  • 0



デジカメの画像をたくさん表示すると重い

デジカメは進化を続け1000万画素を超えるものも出ています。手軽に高画質な写真が取れるのはうれしいですが、写真ギャラリーや一覧表示をすると動作が重くなるのが難点です。

そこで「resizeimage.inc.php」。サムネイルを自動で作成してくれる心強いプラグイン。

機能としては

  1. 任意のクオリティ(圧縮率)のサムネイルを作成
  2. 一度作成したサムネイルをキャッシュとして保存することでサーバの負担を軽減
  3. ref.inc.php」と組み合わせることでwikiファイルを修正しなくても自動で運用可能

と、これ以上何を求めるのか?wといった機能を持っている。(もしも改良するなら元ファイルのタイムスタンプを監視して差し替える機能くらいか?同じ名前でアップし直すことはあまり考えづらいですが…。)


導入方法

1.こちらで「resizeimage.inc.php ver. 1.21 」と「ref.inc.php」をダウンロード。
resizeimage.inc.php ver. 1.21 」は「resizeimage.inc.php」と改名しpluginフォルダへ入れる。
ref.inc.php」の116行目あたり

$script = get_script_uri('rel');

この記述を

$script = get_script_uri();

このように変更して、pluginフォルダへ入れる。


2.キャッシュを保存するフォルダを作成する。

デフォルトではPukiWikiのルートフォルダに「thumb」というフォルダを作るだけ。別の名前のフォルダを作る必要があるなら62行目あたりに

define('RESIZEIMAGE_CACHE_DIR', DATA_HOME . 'thumb/');

というタグが用意されているので、適宜変更しよう。


設定

今回は特に変更しなかった。「resizeimage.inc.php」の数字の部分は0~100のクオリティを選べるようになっている。

define('PLUGIN_RESIZEIMAGE_DEFAULTQUALITY', '70');

図鑑としてある程度の画質は欲しいので、70のままにしておく。

サンプルはこちら「アクアリウムWiki淡水魚図鑑
多くの画像が配置されてますが、小さくリサイズした画像をキャッシュから読み込んでいるため、表示はそれほど重くないと思います。


追記:透過PNGなど、透明のプロパティを持つ画像はリサイズされる過程で透明部分が黒くなってしまう。透過PNGを使いたい場合は画像の指定をURLにしよう。「ルードディレクトリ/image」フォルダにでも入れるといいだろう。

普通透過ファイルを使うことはあまり無いので、問題ないが、もしかしたらリサイズをしない指定を出来るように改造が必要かもしれない。


現在のページを共有する



現在のページに関連する記事

PukiWikiで画像をサムネイルへ差し替える PukiWikiで5段階評価を付けるプラグインを作成しました
SyntaxHighlighterの記述方法 SyntaxHighlighterの記述方法
PukiWikiで表をソートしたい PukiWikiで表をソートしたい
PukiWikiで画像をサムネイルへ差し替える 5段階評価プラグインを通して学ぶPukiWikiのプラグインを作成する方法
PukiWikiで画像をサムネイルへ差し替える PukiWikiでlazysizesを利用して画像の遅延読み込みを導入する
PukiWikiへ「attachref.inc.php」と「areaedit.inc.php」プラグインの導入 PukiWikiへ「attachref.inc.php」と「areaedit.inc.php」プラグインの導入
PukiWikiで表組みデザイン PukiWikiで表組みデザイン

おすすめの記事

新しいGoogleマップ「Google Maps Platformの使い方」まとめ

新しいGoogleマップ「Google Maps Platformの使い方」まとめ

W3 Total Cacheの設定を通して学ぶ、WordPressを高速化するキャッシュの仕組み

W3 Total Cacheの設定を通して学ぶ、WordPressを高速化するキャ…

GMO系列のホスティングサービスでGmailへメールが送信できない不具合が発生中

GMO系列のホスティングサービスでGmailへメールが送信できない…

ClamAVとClamSMTPを利用してPostfixのメールをウイルスチェック

ClamAVとClamSMTPを利用してPostfixのメールをウイルスチェック

全く新しい決済サービスPayPal.Meの導入と使い方を解説

全く新しい決済サービスPayPal.Meの導入と使い方を解説

サーバで管理していたWordPressをローカル環境に移行する方法

サーバで管理していたWordPressをローカル環境に移行する方法

メールのエラーコードと、メールサーバのmaillog解析方法まとめ

メールのエラーコードと、メールサーバのmaillog解析方法まとめ

公式ドキュメントよりも詳しいTinyMCEの使い方(基本編)

公式ドキュメントよりも詳しいTinyMCEの使い方(基本編)


コメントを残す

コメントは認証制のため、すぐには反映されません。

プログラミングに関する質問は「日本語でプログラミングの悩みを解決するQ&Aサイト sukegra」をご利用ください。