1-Wpで電子書籍っぽいページめくり効果が使えるプラグインFlippingBook Galleryの使い方 基本編

くつキッチュ!アイコン wordpressカテゴリへ くつキッチュ!SCRAPス アイコン creator-help創作支援)カテゴリへ くつキッチュ!アイコン-e-book-電子書籍

 

追記:「WordPressの更新後、『FlippingBook Gallery』の表示に不具合が出るようになりました。」

現在、ご覧いただいている環境で不具合が出るという方は、ブログに縦書きテキストを埋める、BiB/iなどご利用になられると良いかと思います。

詳細 ⇒ 創作家さんに朗報!電子書籍の試し読みも出来る電書ちゃんのtumblr無料テーマがなまらスゴイ!

 

 

一昨日簡単にページめくり効果を入れられるFlippingBook Galleryをちろっとだけご紹介させていただきましたが…

今回はFlippingBook Galleryの基本編ということで、大まかな流れや基本設定についての記事となります。

※記事が長くなってしまったので本日は概要のみということで、実際のBookの作成は明日以降となります。

Spanish dictionary pages up into the air by Horia Varla Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方Spanish dictionary pages up into the air by Horia Varla

もくじ

Bookの作成方法はいくつかあるのですが、今回は「イメージギャラリーを作る」 ⇒ 「イメージギャラリーからBOOKを作る」の説明となります。

※WordpressプラグインFlippingBook Gallery(プラグイン名はPage Flip Image Galleryがインストールしてある前提での説明です。

先にBookのサンプルを見たい方は⇒コチラ

イメージギャラリーの作り方

まずはBookに作成に必要な『新規イメージギャラリー』を作ります。

Page Flip Image Galleryプラグインをインストールすると、ダッシュボードに『FlippingBook』という設定項目が表示されますので…

1.ダッシュボード⇒設定⇒FlippingBook⇒images⇒よりGalleriesに入ります。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :設定画面へ

2.新規ギャラリーを作ります。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :Create New Gallery

Galleriesで[Create New Gallery]をクリック⇒[Gallery Name]が開きます。

3.[Gallery Name]に任意の名前を入力します。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :Create New Gallery GalleryNameを入力後、Add Gallery

[Gallery Name]に後で自分がわかりやす名前を入力し、⇒[Add Gallery]をクリック

※今回は『sample』としました。

新規Galleryに画像を追加する。

『新規Gallery(sample)ができましたので、ギャラリーにBookで表示したい画像を追加していきます。

1.新規ギャラリー『sample』の[Upload images]をクリックします。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :作成されたGalleryに画像を入れていきます

2.新規ギャラリーへの画像の追加方法を選択します。

20140411-k-kizi8_mini

◆画像追加方法◆

  • 新規アップロード
  • アーカイブ(zip)をアップロード
  • 画像URLを入力
  • FTPの画像フォルダのURLを入力

ここでは、Add From URL (画像URLを入力)を選びました。

3.「メディアを編集」から画像URLと画像タイトルを入力します。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :『メディアを編集』などから画像URLを入力

[Upload]をクリックするとGalleryに画像が追加されています。

20140411-k-kizi10_mini

同じ手順で、Bookで表示したい画像を追加しておきます。

新規ギャラリーからBOOKを作成

作成したギャラリーからBOOKが作成出来ます。

1.追加された新規ギャラリー『sample』のメニューから[Create Book]をクリックします。

20140411-k-kizi10_mini

2.BOOKの基本設定画面が開きますので、各種項目を入力します。

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 :BOOKの基本設定画面

最後に[Add Book]をクリックすると、設定が保存されます。

Preview(プレビュー)で確認

FrippingBook⇒Manage books and pages⇒作成したBookの[Preview]

Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方 基本編 プレビュー

で、Book表示を確認できます。

基本設定項目[BookProperties]について

基本設定の項目は結構大量にあります…;;

20140411-k-kizi12_mini

一応全部調べたのですが、すべてを説明するとなるとかなり冗長になってしまうので、下記の表以外の設定に関しては説明は省いています。

◆おおまかな設定表◆

◆Book name ブックの名前
◆Width・Height デフォルト 縦480 横640(見開き)
◆ブック背景設定 デフォルト背景Or背景無し
◆Background Color 背景色
◆Background Image 背景イメージの有無
◆Upload Background Image オリジナル背景画像アップロード
fit⇒ブックに合わせる
center⇒中央配置
centerleft⇒左上配置
◆Smooth Pages ページめくりをスムースに※重くなる
◆Rigid Page Speed ページめくりスピード
◆Preloader Type 読み込み中アイコンの種類
◆Flip on Click クリックでページをめくるかどうか
◆Flip Sound オリジナルのページめくり効果音をアップロード
◆Upload Sound ページめくり効果音
◆Zoom Enabled ズーム許可、不許可
◆Zoom On Click クリックでのズーム許可、不許可
◆Zoom Image Width ズーム時の横幅
◆Zoom Image Height ズーム時の高さ
◆Print Enabled プリントボタン表示、非表示
◆Download Enabled ダウンロードボタン表示、非表示

デフォルトのままでもめちゃくちゃ使い勝手が悪いというわけでもないので、まずは「デフォルトの設定のまま作成し、気になる箇所があればいじる」という感じでよろしいかと思います。

必要に応じて随時説明は追加していきますが、気になる方は設定ページで詳細をご確認下さいませ。

 

明日は実践&ズーム関係、その後は見開きや透過画像について

というわけで、ページめくり効果が簡単に導入できるプラグイン『FlippingBook Gallery』の大まかな使い方と基本設定でした。

明日は実践編ということで、いよいよ実際に画像をBookにしてみたいと思います。

こんな感じに表示されます↓

※表紙の薔薇画像はファイルサイズをBookに合わせて設定しておりませんので、縦横比が崩れております。
※金魚の見開き絵に関しては404.gif sorry-100 illust by s.sS.S作です。

もくじへ戻る↑

先ほど設定はデフォルトでも使えないことはないと申し上げましたが、それでもいくつか微妙な箇所があります。

明日は実践でのBook作成の他、基本設定の中で特に引っかかったズームに関する説明まで(できたら)します。(←長くなりすぎて出来なかったら明後日になります…(;´∀`))

その他、透過画像や、見開きなどの説明も随時更新する予定です♪

でっは~(*´∀`*)ノシ

ブログランキング・にほんブログ村へ
にほんブログ村

  • このエントリーをはてなブックマークに追加
  • Share on Tumblr

関連記事

クリスタのライン抽出ツールがスゴい! まず早い! 適当背景

クリスタのライン抽出ツールがスゴい! まず早い! 漫画を描いたことのない私が一瞬で背景をつくってみました♪

  CLIP STUDIO-EX(クリップスタジオEX) 作成時間:約2

記事を読む

Twitterでおすすめリツイートしたクリスタ素材まとめ 全品サンプル画像つき♪ 起毛ブラシ「もふぃ」で描いたうさぎ illust by サトウトシオ @310104o

Twitterでおすすめリツイートしたクリスタ素材まとめ 全品サンプル画像つき♪

もふぃでうさぎを30秒以内に描く illust by サトウトシオ@310104o &

記事を読む

電子書籍出版舞台裏『インサイド・アウトサイダー #バグ式』、宙二を語る。

  ※挿絵用にCC0の写真を加工してみました。PART2 進捗は? &n

記事を読む

Nesting boxes by Guillaume Speurt, on Flickr 創作系クリエイターさん向けWp構造をお試しかっ?!

創作系クリエイターさん向けWp構造をお試しかっ?!

  Nesting boxes by Guillaume Speurt, on Flickr

記事を読む

電子組版試行錯誤中 各部名称 行送り字送り

お手軽に使える電子書籍の組版フォーマットを試行錯誤中

  前回までのあらすじ 「紙か?電子か?…それが問題か?」電子書籍とジャンルと組版 の相関関係に

記事を読む

電子書籍出版進捗。校正、常用外漢字とかアラビア数字とか…… アイキャッチ画像 CC0画像に加工してみました3

電子書籍出版進捗。校正、常用外漢字とかアラビア数字とか、ゲシュタルト崩壊とか……

  ※挿絵用にCC0の写真を加工してみました。PART3 進捗は? &n

記事を読む

Tumblrボタン(フォロー、共有)設置方法 記事下設置やプロフィールへの設置、その他シェア方法など イチパン!サンプル

WordPressでTumblrボタンを実装してみた(記事下、サイドバーへの設置、その他シェア方法など)

  Share on Tumblr こちら、昨日作ったくつキッチュの姉妹サイト『イチ

記事を読む

架空の商品、店、サービス等の設定進捗状況+オマケ 架空グルメアニメ【えんたんぐるめんと!】ロゴ

架空の商品、店、サービス等の設定進捗状況+Tumblrのあれ

サトウトシオ『宇宙をデバッグする、簡単なお仕事です』【1】登場予定の架空グルメアニメロゴ Sto

記事を読む

素材使ってね♪のサンプル でかっ何おとめ?

あなたのイラストを簡単に見栄え良くする手前味噌フリー素材をしれっと紹介する回

  苺でかっ! 前置き    本日は全面的に姉妹サイトの素材使ってねと

記事を読む

【創作者さん向け】アレやコレが写り込んだ写真って背景素材に使えるの?【写り込み規定メモ】 自分が撮影した写真に写り込んだ様々な著作物(付随対象物)+人物

【創作者さん向け】アレやコレが写り込んだ写真って背景素材に使えるの?【写り込み規定メモ】

  写真の権利説明図:くつきちよこ   登場人物:くつきちよこ ※管理人   佐

記事を読む

  • 創作クラスタ応援し隊のくつきちよこ(崛起智世子)です。 このブログは、「ネット著 作権」、「セルフプロモーション」、「ワードプレス運用」、「電子書籍サービス」、 「自己出版(セルフパブリッシング)」、「創作」等に関する情報をお届けしておりま す。 ※Wiki『創作ステージ@まちペディア』(ちょっと押してますが)作成中です♪
  • follow us in feedly
  • くつキッチュ/スクラップス! on Tumblr

  • 「表現の自由を守る党」自作応援バナー くつきちよこ

  • マウスコンピューター/G-Tune