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で表組みデザイン

おすすめの記事

FuckAdBlockを利用して自由自在にAdblock対策をする方法

FuckAdBlockを利用して自由自在にAdblock対策をする方法

DNS Amp攻撃の解説と、踏み台にされないためのBIND DNSの設定

DNS Amp攻撃の解説と、踏み台にされないためのBIND DNSの設定

開発の最前線でクリエイター・エンジニアに必要なプログラミング言語

開発の最前線でクリエイター・エンジニアに必要なプログラミン…

シンプルなスパムコメント対策プラグイン「Simple AntiSpam」を作成しました

シンプルなスパムコメント対策プラグイン「Simple AntiSpam」を…

最新のXAMPPをインストールし、安全・高速に運用する方法

最新のXAMPPをインストールし、安全・高速に運用する方法

fluentdと連動して集計処理を行うNorikraの導入方法

fluentdと連動して集計処理を行うNorikraの導入方法

サーバの処理を自動実行するcronの仕組みと応用法

サーバの処理を自動実行するcronの仕組みと応用法

Windows 10でpsd形式のファイルをサムネイル表示する方法

Windows 10でpsd形式のファイルをサムネイル表示する方法


コメントを残す

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

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