画像をクリックしたらポップアップして拡大させたい!
とにかく簡単に画像を拡大するプラグインを探している
難しい設定とかよくわからない!
画像をクリックしたら、フワッと浮かび上がって拡大させる方法を探していませんか?
画像にちょっとした動きをつけるだけで、カッコよくなります。
なので、ブログなどでキレイに画像を見せたい人は、ぜひ活用したいところです。
ただ、自力でこの効果を画像につけようとすると、けっこうめんどくさい…。
そこで、WordPressのプラグインを使えば、特に難しいことはせずに、簡単に画像をポップアップで拡大表示させることができます。
今回は、画像をクリックしたらポップアップで拡大表示することができる「FancyBox for WordPress」のインストールから使い方までわかりやすく紹介します。
めちゃくちゃ簡単なので、この記事を参考に使ってみてください。
プラグインのインストール方法などは『WordPressのプラグインとは?インストールの方法まで徹底解説』を参考にしてみてください。
目次
FancyBox for WordPressでできること
FancyBox for WordPressは、画像を拡大ポップアップ表示させることができるプラグインです。
WordPressのギャラリー機能にも対応しているので、写真をたくさん紹介したい人にもオススメのプラグインです。
FancyBox for WordPressの使用例
FancyBox for WordPressのインストール
WordPressの管理画面から、①プラグイン→②新規追加→③検索ボックスにFancyBox for WordPressと入力→④インストールをクリックして有効化します。
これでFancyBox for WordPressを使う準備はOKです!
FancyBox for WordPressの使い方
FancyBox for WordPressを使ってポップアップ拡大表示させるには、画像を追加するときにリンク先をメディアファイルにする必要があります。
リンク先をメディアファイルにしないと、ポップアップ拡大表示されないので注意してください。
画像をポップアップ拡大表示させる方法
投稿画面で「メディアを追加」をクリックします。
追加したい画像を選択したら、リンク先をメディアファイルにして投稿に挿入をクリックします。
これで投稿画面に追加された画像は、拡大ポップアップ表示されるようになります。
ちゃんとポップアップ表示されているかどうか、記事のプレビューで確認してみてください。
ギャラリーで画像をポップアップ拡大表示させる方法
投稿画面でメディアの追加をクリックします。
①ギャラリーを作成をクリックします。
②ギャラリーに載せたい画像を選択します。
③ ギャラリーの作成をクリックします。
リンク先をメディアファイルに変更して、ギャラリーを挿入をクリックすると投稿画面にギャラリーが追加されます。
これでギャラリー内の画像をクリックすれば、ポップアップ拡大表示がされるようになります。
設定がちゃんとできているか、プレビューで確認をしておきましょう!
ギャラリーの設定
ギャラリーの基本的な設定を簡単に説明しておきます。
キャプション
キャプションは画像の下に好きなテキストを表示させることができます。
カラム
何列で画像を表示させるか設定することができます。
サイズ
ギャラリーに表示される画像のサイズを設定することができます。
FancyBox for WordPressの設定
管理画面の「設定」から「FancyBox for WordPress」選択すると、FancyBox for WordPressの設定画面ページへアクセスすることができます。
デフォルトのままでも問題ないのですが、画像の表示方法、アニメーションの動きなど、設定画面で選ぶことができます。
こだわって画像の表示をしたい人は、いろいろと試して好みの表示方法を見つけてみましょう!
画像をポップアップ拡大表示させるメリット
- ユーザーがページの移動をしなくて済む
- 記事幅に関係なく大きな写真を見せることができる
- なんかカッコイイ・オシャレ♪
このようなメリットがありますが、一番大きなメリットはユーザーがページの移動をしなくて済むのがとても大きなメリットです。
画像をクリックするたびに、違うページへ移動してたら見るのがめんどくさいですよね。
画像をポップアップさせるデメリット
- スマホだと効果はあまりない
- 画像が多いとページの表示速度が遅くなる
- プラグインを入れるのでページ表示速度が遅くなる
画像をポップアップで表示させる必要性がないブログなどは、導入しないほうがいいです。
そんなに重いプラグインではないので、ページの表示速度が極端に落ちることはありませんが、インストールするプラグインは少ないにこしたことはありません。
ただ、画像をポップアップさせたりするとテンション上がるので、一度このプラグインを入れて遊んでみて、必要ないと思ったら削除しちゃいましょう!(笑)
とりあえずやってみるのが大事!
まとめ
画像をクリックしたら、ポップアップ拡大表示させることができるプラグイン「FancyBox for WordPress」のインストールから使い方まで紹介しました。
画像を挿入するときに、リンク先をメディアファイルに設定するだけで、画像をポップアップ拡大表示することができます。
とても簡単で便利なプラグインなので、ぜひ使ってみてください!
WordPressで集客できるブログを作る方法まとめ
WordPressでブログを始めよう!
WordPressの設定
- WordPressをインストールしたら必ずやったほうがいい初期設定
- カンタンにWordPressのユーザー名を変更する方法!【セキュリティ対策】
- 不要なWordPressテーマを簡単に削除する方法【2分で解決】
- WordPressで失敗しないパーマリンクの設定方法!【ドメイン+postnameでOK】
- すぐできる!WordPressにYouTubeの動画を埋め込む方法
- WordPressにツイッターを埋め込む方法を画像付きでわかりやすく解説!
- スマホでWordPressのブログを投稿する方法!効率が悪いので工夫をしよう
- 【Atom設定】WordPressの下書きで大活躍するテキストエディタ!爆速!
- エックスサーバーで特定のカテゴリーにBasic認証を設定する方法【WordPress】
- 501エラーでWordPressの更新ができないときの対処方法【エックスサーバーWAF設定】
- WordPressエディターでPHPファイルを出力する方法【5分で完了】
- TablePressの検索ボックスにプレースホルダーテキストを表示させる方法
- 【コピペOK】コンタクトフォーム7の送信ボタンをカスタマイズをしよう!
WordPressのテーマについて
WordPressのプラグイン
- WordPressのプラグインとは?インストールの方法まで徹底解説
- オススメのWordPressプラグイン!SEO対策・ブログ運営・アフィリエイトで役立つ!
- Table of Contents Plusの設定方法!初心者でも簡単に目次が作れるプラグイン
- Cache Enablerの設定と使い方【キャッシュでブログの表示速度が上がる!】
- Autoptimizeの設定と使い方【ブログの表示速度を上げる!】
- Google XML Sitemapの設定・使い方を徹底解説
- サイトマップを自動生成してくれるPS Auto Sitemapの使い方と設定を解説
- Lazy Load-Optimize Imagesの設定【画像の遅延読み込みで表示速度UP!】
- EWWW Image Optimizer設定&使い方!画像を圧縮して表示速度UP
- 【TinyMCE Advanced】初心者でも簡単にブログの装飾ができるようになるプラグイン
- WordPress Popular Postsの設定方法【人気記事を簡単に表示】
- FancyBox for WordPressの設定と使い方!画像をポップアップ拡大表示できる
- AddQuicktagの設定&使い方【効率的にブログが書ける!】
- 【WP Dashboard Notes】WordPressダッシュボードにメモできるプラグイン
- WordPressのリンク切れを自動チェック!Broken Link Checkerがオススメ
- 【初心者】WordPressでお問い合わせフォームを簡単に作る方法
- Site Kit by Googleの設定方法!WordPressの管理画面でGoogleデータを全部チェック
- All In One SEO Pack一般設定の設定方法【初心者にわかりやすく解説】
- 【WordPress】カテゴリーの順番を簡単に変更できるプラグイン
- カテゴリーを一括で変更できるプラグイン【WordPress】
- スパムとさよなら!Akismetの設定方法をわかりやすく解説