画像クリックで全画面大きく表示する方法（Easy FancyBox プラグイン）＠WordPress

記事上に配置したイメージをクリックすると、画面全体に大きく拡大して表示する方法です、「Easy FuncyBox」プラグインを使うととっても簡単です。記事内では小さく利用している画像でも１クリックで大きく表示できるのでユーザー（読者）にも見やすく読みやすいページになります。

クリックした画像をふわっと大きく表示するサンプル

記事上に配置したイメージをクリックすると、画面全体に大きく拡大して表示します。

（ 本記事上のイメージも、クリックすることで画面に大きく表示しています。）

Easy FancyBox プラグインのインストールと設定

■ Step.1 プラグインをインストールする

WordPress の管理画面から、「プラグイン」→「新規追加」 で 「Easy FancyBox」を検索するとプラグインが出てきます。

確認してインストールし、有効化します。

■ Step.2 East Funcy Box を設定する

WordPress の管理画面から、「設定」→「メディア」で設定画面を表示します。

大きな画面を表示するとき（消えるとき）に、フェードイン、フェードアウトさせたい場合は、「動作」設定で、トランジションイン、トランジションアウトの設定を「Elstic」から「フェード」に変更します。

記事内の画像を、ふわっと大きく表示させる方法

イメージにリンクを貼る操作（リンクボタン）をクリックして、リンクではなく、「メディアファイル」を設定します。

完成です！プレビュー画面で実際の動作を確認してください。

WordPress の「ギャラリー」で利用する方法

WordPress には「ギャラリー」（画像を並べて表示する）機能があります。ギャラリーを利用した場合の、画像をふわっと大きく表示させる場合の方法です。

■ Step.1 ギャラリーを作成する

ブロックで「ギャラリー」を指定して、「アップロード」または「メディアライブラリ」で画像を選択します。

■ Step.2 ギャラリーにリンクで「メディアファイル」を設定します

ギャラリーのプロパティでリンク先に「メディアファイル」を設定します。

完成です！プレビュー画面で実際の動作を確認してください。

まとめ：画像クリックで全画面大きく表示する方法

記事上に配置したイメージをクリックすると、画面全体に大きく拡大して表示する方法では、「Easy FuncyBox」プラグインを使うと簡単です。

おしゃれな記事をぜひ書いてくださいね。