メニュー 閉じる

minishowcase：モノグサ太郎な写真ギャラリーに最適


時々写真を増やしたいけれども、1点づつ設定してアップロードするのが面倒くさーい！ とか。あるいは、こんなこともあるだろう。

  • ウェブサイトは1つなんだけど
  • 画像作製は複数人
  • 作られた画像をBiNDを操作する特定の1人に画像を送って、
  • その送られた代表者がBiNDにまとめて作業をしなければならない

こうなると、その担当者ばかりに負担がかかるし、その担当者が手を打ってくれない限り画像が公開されないという事態に陥ってしまう。

——それは、不便。担当者に選ばれた1人も不幸だ。

minishowcaseを使ってみる

minishowcaseサムネイル

だったら、決められたディレクトリに、みんながそれぞれ勝手に画像ファイルをアップロードすると、動的に画像ギャラリーを作るという仕組みをサーバーサイドに置いとけばよくなくね？ まぁ、そういうことです。

自分で作るのが面倒ですが、そういうのをマメに作っては無料で公開してくださるたいへんありがたい方々が世界中にいらっしゃいます。このたびは、その中でも設置が簡単な minishowcase を使ってみることにします。PHPベースなので、扱いが簡単だと思いますけど、ときどきPHPが使えないサーバーがあるので要注意。

群馬だと、群馬インターネットなんかPHPがインストールしてあるのに使えないという不便さがありますのでよく検討してみてください。

  • このページを参考にして不具合が生じても、記事掲載者はその責を負わないものとします。
  •  少なくともFTPクライアントが必要となります。
  • FTPアカウントはコンピュータウィルスGamblar（ガンブラー）の標的となっているようです。日頃のウィルスチェックは怠ることのないよう 警告します。
  • FTPの説明には、FireFTPを使用していますが、好きなFTPクライアントでかまいません。
  1. ダウンロード
  2. 設置（アップロード）
  3. フォルダ名が、そのままギャラリー名
  4. ファイル名を変えると、表示名が変わる
  5. その他の部分も日本語化していこう
  6. 「Thank you for installing…」を替える
  7. 各ギャラリーのフォルダ内にも「_info.htm」を入れておく
  8. その他の設定も「settings.php」をいじくる
  9. どうして背景は黒なわけ？
  10. ギャラリーの表示方法の、お色気
  11. ギャラリー・写真の並び順は、基本的に昇順
  12. みんなのファイルが出そろうまで ギャラリーを保留にしたい
  13. 画像はあらかじめリサイズして調整しておいた方がいい

ダウンロード

まず、minishowcaseをダウンロードします。
このたびダウンロードして使わせてもらったのは、v09b142版。

【リンク】minishowcase.net GitHub

配布ファイルはzipです。（zipを展開できないヒトは、設置を諦めてください）

展開したzipの中の「Instructions.htm」が説明書になっていますので、一通り目を通しておいてください。

  • PHPは4.2.0以上
  • GD/GD2モジュールが必要

サーバー要件は、最低これだけ。では、設置しましょう。

設置（アップロード）

  1. minishowcaseフォルダまるごとアップロードしちゃいます。フォルダの名前は適当な名前に付け替えておいた方が、あとで使いやすいです。gallery2010とか、photoとか、sampleとか。作者に敬意を表して「minishowcase」のままでももちろんOK。
  2. アップロードした中の【cache】ディレクトリのパーミッションを、777に変更。パーミッションを777に
  3. サーバーによっては、phpファイルに実行権限が必要なこともあるので適宜適用。
  4. 【galleries】ディレクトリ内に、画像が入ったフォルダ丸ごとファイルをアップロードすると、アップロードしたフォルダ名のイメージギャラリーのできあ がり！っと。
  5. なお、認識できる画像形式は、「.jpg（.jpegも可）」「.png」「.gif」の3種類。

簡単だ。ほとんど何も考えなくていい。

フォルダ名が、そのままギャラリー名

ギャラリー名【galleries】にアップロードした写真フォルダの名前が、そのままギャラリーの名前になります。フォルダ名はたいてい英数字（記号抜き）で構成されるため、表示に問題は無いと思います。

ただ、英数字のギャラリー名に拒否反応があるヒトは、ニッポン語も使用可能です。

minishowcase自体がUTF-8（という名前の文字コード）で動いているので、ディレクトリ名の文字コードもUTF-8にしちゃえばいいだけです。

  1. FTPクライアントで設定します。Edit
  2. エンコーディングをUnicode(UTF-8)に変更します。UTF-8に
  3. 設定した上で、日本語ディレクトリ名にすると、ギャラリー名もニッポン語になるよ。

ファイル名を変えると、表示名が変わる

ファイル名フォルダ（ディレクトリ）名がそのままギャラリーの名前になるように、ファイル名はその作品名＋キャプションとなります。たとえば、こんなファイル名があったとします。
photo_gunma-this_is_a_pen.jpg
これは、キャプションとして、次のように表示されます。
photo gunma - this is a pen

拡張子（「.jpg」とか）は除去され、アンダースコア（_）がスペース（ ）に自動的に置き換わり、ハイフン（–）には前後にスペースが付くというコトのようですね。

このことから解るように、ある程度ファイル名をリネームしたり手間をかけると、より良いギャラリーとなるでしょう。いちいちタイトルが 「DSC_0245.jpg」とかでは、ねぇ？

うっかりファイル名にスペース（ ）を入れないようにご注意を。

ファイル名なお、ファイル名は半角英数字（記号除く）で構成するのが基本ですが、上記でサーバーのディレクトリの文字コードをUTF-8で扱えるヒトは、このファイル名も日本語化することができます。でも、ファイル名は長さ制限がわりと短いですし、長いキャプションはギャラリーをつまらなくすることもあります。あまり凝りすぎない方がいいと思います。

  • この先は、必要に応じてHTMLエディタなどを適宜ご用意ください
  • 文字コードは必ずUTF-8で保存します。
  • HTMLエディタについて説明しませんが、検索すればフリーのものもたくさんあります

その他の部分も日本語化していこう

今まで、この2つの関係に注目して日本語化しました。

  • ディレクトリ（フォルダ）名 → ギャラリー名
  • ファイル名 → 作品名（＋キャプション）

他の部分は、そういうわけにはいかないので、まず日本語ローカライズファイルを作ります。【languages】フォルダの中のどれかを複製して、名前をjp.phpに変更し、開きます。en.phpは英語、fr.phpはフランス語……なので、参考にしやすい得意な言語を選択すると良いでしょう。

タイトル部分例ではjp.php5行目を、
$lang["menu_title"] = "ギャラリー";
としています。長すぎるとみっともないかもしれませんが、工夫次第ですね！

他に、右側1行目の「select a gallery from the galleries menu」も日本語化したいところですが、どういうわけだかこれが日本語にならないので、jp.phpの7行目は、要らないかったり。というわけで、4〜10行目はこんな内容になります。

    /* galleries */<br />
$lang["menu_title"] = "ギャラリー";<br />
/* select a gallery from the galleries menu */<br />
$lang["menu_guide"] = "";</p>
<p>    /* back to thumbnails */<br />
$lang["lightbox_back"] = "ギャラリー一覧にもどる";

保存する前に、文字コードがUTF-8かどうか確認しておいた方がよいでしょう。

【language】フォルダの中にjp.phpができたら、アップロードして、次のファイル。

config/settings.php を開き、70行目付近
$settings['set_language'] = 'en';
を、
$settings['set_language'] = 'jp';
と変更します。

「Thank you for installing…」を替える

Thank you for installing...そんな内容が表示されたって、イメージギャラリーを見て貰うには関係ない内容なので、内容が合った物に取り替えたい。この表示内容は、galleries/_info.txt の内容がそのままインクルードされているにすぎない。

だから、_info.txt を適宜書き替えましょう。

でも、テキストファイル（.txt）になっていると、HTMLエディタを使ってもHTMLタグがタグとして認識されずに使いづらいことがあるから、ファイル名も「_info.htm」とか、HTMLファイルに変更するのもアリ。

そうすると、今度は「_info.txtをインクルードする」っていう指令が届かなくなっちゃうので、設定ファイル config/settings.phpの210行目
$settings['info_file'] = '_info.txt';
を、
$settings['info_file'] = '_info.htm';
に修正。

あとは、「_info.htm」を思う存分いじくりたおしてください。

でも、この最初のあいさつというか看板というか能書きというか、これ要らなくね？ というヒトもいると思います。その場合は、settings.phpの185行目付近
$settings['gallery_default'] = false;
をtrueにしておくと、いきなり一番初めのギャラリーを開きます。

各ギャラリーのフォルダ内にも「_info.htm」を入れておく

前項で_info.txtのままならば、もちろん「_info.txt」のことです。ギャラリーごとに解説や能書きなどを表示することができます。無ければ無いで、ひたすら写真（サムネイル）を表示するだけなので問題は無いです。

その他の設定も「settings.php」をいじくる

【config】フォルダ内にあるsettings.phpというファイルが設定ファイルになっているので、お好みでいじくることができる。

サムネイルが出ない時の解決方法

これはGDライブラリがインストールされていないとか使用できないとかそういうことが原因でサムネイルを生成できないサーバーがあります。

238行目付近の
$settings['create_thumbnails'] = true;
をfalseしてみると、出ることもあります。プレビュー画面の小っさいサムネイルはこれでも表示できませんけど。

my … pictures をやめたい

英語表示を続けるなら、my（タイトル＝フォルダ名）picturesでもいいのですが、誰かにそそのかされて日本語化しちゃった場合、それおかしいですね。my ... pictures

    /* prepend to the gallery name<br />
* VALUES: [ <text> ] */<br />
$settings['gallery_name_prepend'] = 'my';</p>
<p>    /* append to the gallery name<br />
* VALUES: [ <text> ] */<br />
$settings['gallery_name_append'] = 'pictures';

この中の「my」と「pictures」を、適当な言葉に入れ替えちゃいましょう。……たとえば、こんな

    /* prepend to the gallery name<br />
* VALUES: [ <text> ] */<br />
$settings['gallery_name_prepend'] = '';</p>
<p>    /* append to the gallery name<br />
* VALUES: [ <text> ] */<br />
$settings['gallery_name_append'] = 'の写真';

無ければ無いで何とかなるものですから、敢えて「my」部分は空白（というか、ヌル）にしてみました。正直なところ、「の写真」だって不要なんじゃないかと感じています。

ギャラリー全体の幅を変えたい

もともと800ピクセルで表示するようになっていますので、あのオーサリングソフトで埋め込みたいのに幅がちょっと足りなくてねー……、なんて場合は、178行目付近
$settings['gallery_width'] = 800;
この数字を、適当な数字にします。単位はピクセルです。

ギャラリーの幅を変えたら、サムネイルの数も変えたくなった

117行目付近
$settings['max_thumbnails'] = 6;
の数字を任意の数字に変えることで、サムネイルの列数を指定できます。サムネイルの列数が指定できればサムネイルのサイズも自ずと決まります。

ちなみに、行数も変えたければ次の項目、126行目付近です。（初期設定は4）

サムネイル画像は、基本的に表示するその時にその場で生成しているため、ここの数が多すぎると激重になりますので、ほどほどにしておいたほうが良いでしょう。個人的な意見としては、幅800ピクセルなのに6列ではサムネイルが小さすぎるでしょう！ とか思いますので、幅800ピクセルで4列とかに減らして、大きく表示した方が好みです。

行は、縦に延びて行くだけなのでいくつでも。でも、3とか2とかそこそこにしておいた方がユーザビリティ向上にもいいと思います。

なぜサムネイルは勝手に正方形なのだ？

長方形の画像のはずなのに、両端がちょん切れて正方形に勝手に整形するのは余計なお世話！ というヒトのためのオプションは110行目付近
$settings['square_thumbnails'] = true;
これをfalseにすれば、縦横比を変更しないサムネイルになります。

タイトルバーのタイトルを自由に変更したい

タイトルバーいつまでも「minishowcase」って表示させる義理も無い訳なので、173行目付近
$settings['gallery_title'] = 'minishowcase | gallery';
この内容を適宜書き替えましょう。しつこいようですが、日本語を使うならば忘れずに文字コードはUTF-8で保存。

スライドショウの間隔が長すぎるのだ

スライドショースライドショウが用意されています。画面右上に表示される「slideshow」をクリックすると始まります。

初期設定では10秒になっています。何のインジケイターも無く10秒も止まっていると、動いているのか固まっちゃったのか不安になるヒトもいるでしょう。その場合は、355行目付近
$settings['slideshow_seconds'] = 10;
この数字を任意に変更できます。単位は秒。まあ、4とか5とかでいいのではなかろうか、というのが個人的な意見ですが、用途やヒトそれぞれの性格によってお好きな数字でいいでしょう。天の邪鬼なヒトは、4.3とか小数でも大丈夫と思います。

ただし、画像読み込み時間分もこの数字に含むようです。高速回線ならば問題ありませんが、低速回線の場合は数字が小さすぎると何も表示できないうちに次の画像の読み込みが始まってしまう可能性もあります。

どうして背景は黒なわけ？

まだ読んでました？

背景黒なのは、黒いスキンを指定しているからです。

config/settings.phpの103行目付近
$settings['use_theme'] = 'dark';
この「 」の指定が、themes/dark/ ディレクトリを示しています。themesディレクトリに他に何か入っていれば、ためしにそのディレクトリ名を適用してみてください。違う色になりましたね？

ちなみに、テーマはhttp://minishowcase.net/?instructions#themesでdefaultとblueだけ紹介されています。どこかにpinkが落っこちていました。それ以外は、ネットで探すか、自作するか、誰かに頼んで作って貰うかしてみましょう。

ギャラリーの表示方法の、お色気

現在は、minishowcase作者の表示方法になっています。これをconfig/settings.phpの293行目付近
$settings['preview_mode'] = 0;
この数字を変更することで、表示方法を選択できます。

1 : Slimbox 1.22 made by by Christophe Beyls

  • http://www.digitalia.be/software/slimbox
  • some modifications by victor zambrano

2 : ThickBox 2.1 made by Cody Lindley

  • http://jquery.com/demo/thickbox
  • some modifications by victor zambrano

ギャラリー・写真の並び順は、基本的に昇順

基本的に昇順（小さいものから大きいものへ）です。ですから、たとえばギャラリー名を日付等で管理する場合、新しいモノが下に下に追加されていきます。

これが具合悪いようでしたら、降順に変更することも可能です。

ギャラリーの並び順についてはconfig/settings.phpの272行目付近
$settings['gallery_sorting'] = 2;
写真の並び順についてはconfig/settings.phpの273行目付近
$settings['thumbnail_sorting'] = 0;
の、それぞれの数字を変更することで並び順を変更できます。

0,1,2が昇順、3,4,5が降順で、6,7が画像のEXIF情報から日時順の昇順・降順ということです。でも、EXIFデータからはまだちゃんと動かないかもしれない雲行きです。

ファイル名で勝手に並べ替えられちゃうの！ とお嘆きの方は、ディレクトリ名の先頭に数字を付けて「01-写真集1番目」というギャラリー名、ファイル名の先頭に数字を付けて「01-ファイル名.jpg」などとしてください。半角の「数字数字ハイフン」です。この先頭の「数字数字ハイフン」は、ギャラリー画面に表示されないようになっています。

「数字数字ハイフン」を表示させることも可能ですが、べつにいいですよね。それ説明しなくても。

みんなのファイルが出そろうまで ギャラリーを保留にしたい

キモチはわかる。そして、理解者であるminishowcaseの作者はそのような機能もつけておいてくれました。

ギャラリー名（となる、ディレクトリ名）の先頭に「_」（半角アンダースコア）を付けると、それはペンディングとなり、ギャラリーに表示されません。「よし、公開だ！」となったら、そのアンダースコアをFTPクライアントか何かを使って取り去ってください。

画像はあらかじめリサイズして調整しておいた方がいい

最後になってたいへん恐縮ですが、ギャラリー画像はあらかじめリサイズしておいた方がよいでしょう。インターネット利用のコンピュータのうちの約半数が1024×768pxのディスプレイを使っていたりするわけで、もし可能なら縦が600pxを超えないサイズになっているとよいかもしれません。

もちろん、好きずきでいいですけど、デジ亀で撮った生のサイズだとデカすぎて、何をするにももっさり邪魔になることでしょう。

一応、config/settings.phpの中で決めたサイズをキャッシュとして持っているようですので、それほど神経質になる必要もないと思いますが、不要なデータでサーバを食べ尽くしちゃうのももったいないですからね！

それにても、秀逸だな、コレ。こういうの作りたいと思っていましたが、すでに存在していてクリエイティブコモンズ表示-継承 2.5 一般で提供してくれるヒトがいるなんて！ たいへん助かります。

【リンク】minishowcase（アーカイブ）


Posted in ウェブ関連
タグ:, , ,
3.5 2 評価
Article Rating
ウォッチする
通知
0 Comments
インラインフィードバック数
すべてのコメントを表示

関連してるかもしれない記事