photo credit: ahisgett
Wordpressでギャラリーベースのサイトを作ろうと思って色々調べたところ、美人過ぎるwebクリエイターであるところの高橋のりさんが、滅茶苦茶詳しくjQueryやwpプラグインの
Gallerificを使用したギャラリーサイトの作り方を紹介していました。
スポンサードリンク
使いづらいWordPressのギャラリーをけっこう使えるギャラリーにする方法
で、「なんて美人で親切な人なんだ！よぉし！これを参考に作るぞ！」と決意したところ、コメント欄で元祖美人過ぎるwebクリエイターMana様が NextGenのほうがいいぜと言っておられました。
NextGen、調べてみるとギャラリー系プラグインの中では、ど定番のプラグインなんですね。はじめて知りました。
まぁ、マナ様だからというわけでもないんですが、NextGENを使う事にしました。
インストール
プラグイン本体はこちら
WordPress › NextGEN Gallery « WordPress Plugins
以下のサイトでデモが見られます。
NextGEN Gallery NextGEN Gallery » The Gallery Plugin for WordPress
プラグインをインストールしても英語なので、日本語化しましょう。
やり方はとっても簡単。
NextGENの管理メニューからTranslationを選択してダウンロードするだけ。ページを更新するとがらりと日本語化されます。
使い方
まずは基本動作。ギャラリーを作ってみましょう。
ダッシュボードの左側にあるメニューから「ギャラリー」を選択。
「NextGENギャラリーへようこそ！」という画面に移行するので、画像アップロードボタンを押す。
そして新規ギャラリーを作成します。今回は「test」という名前をつけました。
ファイル選択画面に移行します。
そうすると、翻訳されていない画面がでてきますが、ご安心ください。私が訳しました。GOOGLE翻訳を使用してね。
「アップロードする前に、幅800px、縦600px以下に編集しておけ」って意味だと思います。そのようにリサイズしておきましょう。
この画面にアップロードしたい画像データをドロップすると、ファイル名が表示されます。
そして先ほど作成したギャラリー[test]を選択して、画像アップロードボタンを押すと、アップロードが始まります。
それが終わるとサムネイルの作成が始まります。
アップロード作業は以上です。次は実際に投稿してみましょう。
ギャラリーを投稿する
ビジュアルモードに切り替えて、写真アイコンをクリック。
そうするとこんなボタンが出てきます。今回はスライドショーを作ってみます。
スライドショーのラジオボタンをクリックして「挿入」ボタンを押すと[slideshow id=(個別のID)]というショートコードが入力されます。
これで投稿。
やった！スライドショー！ハラショー！
基本的な使い方は以上です。
他にも様々な効果のギャラリーを作ることが出来るのでサンプルをみて色々ためしてみましょう。
ちなみにこのサイトから画像をいただいて使用しています。著作権が帰属しないパブリックドメインです。
その他のメニューについて
zipでアップロード
画像アップロードの項目にある「zipでアップロード」タブより、zipで圧縮したデータをいっぺんにアップロードすることが出来ます。
ここで要注意なのは、Macの右クリックで作るアーカイブでは上手くアップロードできません。上げても「0コアップロードされました」というコメントが出るだけでした。
マカーの方はMacWinZippeを使用すれば成功します。
画像フォルダからインポート
すでにアップロードしてる画像のディレクトリを指定するやり方です。
ギャラリーの管理
リンクの設定、コメント、簡単な編集、ウォーターマーク(コピーライトなどのすかし文字)の適用などを設定します。
一括で変更できるので便利かも。
アルバム管理
複数のギャラリーをアルバムとしてまとめることが出来ます。
オプション
一般設定
ギャラリー画像をアップするディレクトリを設定したりCoolirisというページングなしで閲覧できるギャラリーサイトで画像を共有したり。
サムネイル
サムネイルの最大サイズや画質の設定。
画像
画像の最大サイズや品質、バックアップやリサイズの設定。
ギャラリー設定
ギャラリーにおける一ページ内の掲載枚数、列数、初期設定で見せるのはスライドかサムネイルか、各種エフェクトの設定、ページングなしで時ページに移行するかどうかの設定。
エフェクト
jQueryのエフェクトを設定することで、ギャラリーを設置した際、自動的にタグが挿入されます。jQueryのエフェクト自体は装備されていないので、各元サイトから用意しなくてはならない。
ウォーターマーク
ウォーターマークの設定。文字（フォント自体も）や画像、透過を設定できます。
スライドショー
スライドする迄の時間、サイズ、エフェクトを設定できます。エフェクトはこちらで確認できます。
こんなところですね。
enjoy NextGEN Gallery!