ZenphotoでかんたんWebギャラリー

第5回 標準テーマをカスタマイズする

この記事を読むのに必要な時間:およそ 1.5 分

これまでの説明で,Zenphotoの基本的な機能とその使い方について紹介してきました。今回はそこから一歩踏み込んで,標準テーマからギャラリーを自分が望むデザインへと近づけていくための,Zenphotoそのものやテーマに備わっているオプション機能によるカスタマイズを紹介します。

サムネイルサイズのカスタマイズ

Zenphotoでは,アップロードした画像に対して自動的にサムネイルが生成されます。これは通常は100×100ピクセルのサイズで生成されるのですが,この自動生成されるサムネイルのサイズを任意に設定することが可能です。

管理画面の「オプション」タブの中にはギャラリーに関する各種設定が存在します。その中の「テーマ」タブを選択すると数ある項目の内に,⁠サムネイルサイズ」という項目があるのが分かります。

図1 テーマのオプション設定画面

図1 テーマのオプション設定画面

図2 サムネイルサイズの設定

図2 サムネイルサイズの設定

ここでサムネイルを通常値よりも大きい140とすることで,ギャラリーで表示されるサムネイルのサイズが140×140ピクセルの正方形になります。

図3 サムネイルサイズを通常より大きくしたアルバム表示

図3 サムネイルサイズを通常より大きくしたアルバム表示

一覧でもっと多く画像を見せたい場合は逆に値を小さくするなど,好みのサイズに調整をすると良いでしょう。

ウォーターマークのカスタマイズ

第3回で画像の保護について紹介した時に,ウォーターマークにはデフォルトで以下の4つのパターンを選ぶことができると言及しました。

  • copyright:コピーライトマーク
  • watermark:通常のウォーターマーク
  • watermark-text:テキストのみのウォーターマーク
  • watermark-video:動画作品向けのウォーターマーク

管理画面の「オプション」タブからは,⁠画像」タブを選択して,その中の「透かし」の項目でギャラリー全体にウォーターマークの設定を行うことができます。ここで項目の説明文に注目してみると,⁠画像はpng-24形式で,plugins/watermarks/フォルダにあります。」というメッセージがあります。

図4 画像のオプション設定

図4 画像のオプション設定

図5 透かし(ウォーターマーク)の設定

図5 透かし(ウォーターマーク)の設定

これは「http://<アップロードしたフォルダ>/Zenphoto/plugins/watermarks/」の中に,⁠png-24形式」の画像ファイルをアップロードすることで,その画像ファイルを新たなウォーターマークとして利用できることを示しています。

そこで,該当フォルダに筆者の所属している会社ロクナナのロゴを「rokunana_logo.png」というファイル名でアップロードしてみます。

図6 rokunana_logo.png

「rokunana_logo.png」

すると,ウォーターマークの選択肢に,新たに「rokunana_logo」が追加されました。

図7 ウォーターマークの追加

図7 ウォーターマークの追加

スケールやオフセットを調整して,⁠画像」のウォーターマークに「rokunana_logo」を適用すると,サムネイルは今までどおりのまま,作品詳細画像にロクナナロゴのウォーターマークが挿入されるようになります。

図8 オリジナルウォーターマーク入りの作品画像

図8 オリジナルウォーターマーク入りの作品画像

著者プロフィール

一戸健宏(いちのへたけひろ)

株式会社ロクナナにて,主にWeb案件のディレクションや,CMSの構築などを担当しているクリエイティブディレクター。

Webだけでなくイベントや撮影など様々な案件を扱うロクナナでは,イベント受付や撮影助手の他,体格を活かして荷物・機材運びなどの力仕事で最前線に立つことも。

URLhttp://rokunana.com/

コメント

コメントの記入