WordPressで写真のギャラリーを探していたのですが、中々試してみたいものが見つからなかったのですが、これは良いかもと思い「FlippingBook Gallery」を設定してみました。
これはデジタルカタログで使われているような、かなり凝ったプラグインだと思います。
さて、設定していくとどうなるでしょうか？
ギャラリープラグイン「FlippingBook Gallery」インストール
プラグインの「新規追加」では「FlippingBook Gallery」とは表示されずに「Page Flip Image Gallery 」と検索結果に出てきます。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
インストール後には「FlippingBook Gallery」となるので、新規追加の検索時の「Page Flip Image Gallery」で、「インストール済みプラグイン」や通常インストールしたプラグインが格納される「設定」を探しても見つからずに少し戸惑ったよ。
このプラグインは「設定」には格納されずに、左側のダッシュボートの下の方に新しく出現していますよ。
迷うよね～
ギャラリープラグイン「FlippingBook Gallery」設定
まずは、画像をアップロードしますので、「Images」からページに入り「Create New Gallery」をクリックして新規ギャラリーを作成します。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
それでは画像を、まずはアップロードするので「Upload Images」クリックしてから、画像を選択してアップロードします。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
アップロードが完了するとこのように今回は「test」としていますので「testギャラリー」が増えますので、「Create Book」をクリックして先に進みましょう。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
ここでは細かい設定を行えますが、今回は「背景」だけ変更して進みました。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
上の設定画面は英語ですが、私は普段、大体の内容が分かれば良いと思っているので、ブラウザに「Google翻訳」を追加しているので、ポチっとします。するとこんな感じになります。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
設定内容を保存した後に、どんな感じになっているか「Preview」で確認できます。ありゃらまだ横画僧が縦落としのページに縦横比が崩れて入ってしまったりしていますね。
細かい修正は後回しにして、これをページに入れる方法を説明しましょう。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
上のキャプチャーをご覧くださいね。「ID」番号が振られているのが分かりますよね。
その番号が重要になります。
下記のショートコードに「ＩＤ」番号を入れて、ページに貼り付けると表示されるようになります。
また、投稿や固定ページのツールにアイコンが増えていますので、クリックするだけで「ＩＤ」以外のショートコードは貼り付けられるので、「ID」番号だけを覚えておけばスムーズに作業が進められますよ。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
基本的な設定は以上になります、細かい設定はしなくても十分デフォルトでも大丈夫でした。
ギャラリープラグイン「FlippingBook Gallery」細かい設定
デフォルトで大丈夫といっても、そうそう画像が縦横比がおかしくなって崩れていました。
その辺も含め設定方法を追記しますね。
「Page Editor」をクリックします。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
するとブックギャラリーのレイアウト調整が出来る画面が開きます。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
ここでは、ページのレイアウトとそこにはめ込む画像の細かい設定ができます。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
赤枠：ページを選択する
青枠：ページのレイアウトが選べます。
緑枠：レイアウトの中に流し込む画像を選択します（画面中央にドラッグ＆ドロップで流し込めます）
ピンク枠：設定を保存
上記で調整をすると、公開しても恥ずかしくない程度になりましたね。
なるほど、見開きで一枚の横画像を見せるには、あらかじめ半分ずつにした画像を用意する必要があるようです。
縦落としの画像だとピッタリマガジン風でカッコいいですね。
でも、これテキストなども画像にあらかじめ入れておくと、プリント機能もあるので、間違いなくデジタルカタログ、雑誌も制作可能ですね。
素晴らしい。
サーバーの容量も関係しますけど、ロリポップ！でも1画像20Ｍまでいけるように設定しているので、Ｄ800で撮影した画像はＡ1印刷まで対応しているので、雑誌サイズなら楽勝だ！
なんて、素晴らしいのだろう。
さらに、背景画像やスキン、音源まで「Book Properties」では、設定ができるようですよ。
私はそこまで細かくは設定しませんでしたが。
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
ちなみに私が修正した項目です。
Width：幅（ピクセル単位）
Height：高さ（ピクセル単位）
Dynamic Scaling：表示画面に合わせて動的サイズ調整をする
Preserve Proportions：縦横比を維持するかの選択
Hardcover：表紙の紙質を選択できます（すぐ戻してしまいましたが）
WordPressデジタルカタログの様な素晴らしいギャラリープラグイン「FlippingBook Gallery」設定
項目の「Dynamic Scaling」に気が付くまでに、画像を綺麗に見せたくて、すぐ上の「Width：幅（ピクセル単位）」と「Height：高さ（ピクセル単位）」を一生懸命変更していましたが、何とすぐ下に「Dynamic Scaling：表示画面に合わせて動的サイズ調整をする」があってガッカリ。
でも、おかげで好みの設定が分かったので、写真は「1440*1080」で上げてるので、それに合わせて「Width：1440」と「Height：1080」にして、「Dynamic Scaling：Yes」であっけなく解決しました（笑）
そんなこんなでこんな感じで完成！
残念なことにフラッシュなので、iphone達では見れませんでした。
ギャラリーページを早速、固定ページで作って置いてみましたよ。
WordPressのデータをバックアップをする「BackWPup」設定
WordPressの定番SEO対策プラグイン「All in One SEO Pack」設定
WordPressでお問合せを簡単に設置できるプラグイン「Contact Form 7」設定
WordPressで画像をにゅっ！表示してくれる「jQuery Colorbox」設定
WordPressでSNSへのリンクボタンを設置できる「WP Social Bookmarking Light」設定
WordPressテーマがスマホに対応していない場合に最適化させてくれる「WPtouch」設定
WordPressサイトを携帯（ガラケー）で表示させてくれる「Ktai Style」設定
WordPressの記事に定型文を投入してくれる「AddQuicktag」設定
WordPressのサイト統計情報を手軽に見たくて「Jetpack」設定
WordPressでサイトマップを作成してくれる「PS Auto Sitemap」設定
WordPressカテゴリーの並び順を変更できる「Category Order and Taxonomy Terms Order」設定
WordPressをスパムから守ってくれる「Akismet」設定