ワードプレスに表示する画像をしっかり見てもらいたいときってありますよね。
アイキャッチ画像や本文中に挿入する画像はあまりサイズが大きすぎると表示が遅くなったりするので適切なサイズにするべきですが、説明したいとかの場合は違います。
そんな時は「クリックしたら大きくなる画像」が便利です。
しかもたまに画像だけのページに飛ぶみたいなやつありますよね？あれじゃなくて、カッコよくボヨンって画像が浮き出るみたいなのにしたい！
実はプラグインもなしで、簡単にできるんです！
でもいざやろうと思ったら・・あれ？どうやるんだろう？ってなっちゃいます（汗）やり方を説明しておきますね♪
ワードプレスで画像をクリックしたら拡大させる方法
まずは大きく表示させたい画像を追加します。追加の仕方はこちらの記事をご覧ください。
この時の画像サイズがクリック後の画像サイズになりますので、小さすぎず大きすぎずのものをアップロードするようにしてくださいね。
で、ここからがいつもの画像挿入方法と変わります！
クリックしたら画像が拡大するための設定ポイント
画像を挿入する前に、右側にある「添付ファイルの詳細」部分の設定を変更します。
例えば用意したこちらの画像。2000×1281の画像です。
添付ファイルの詳細にて、タイトルと代替テキストなど必要事項を入力したら、下にスクロールします。
添付ファイルの表示設定のところを下記のように変更します。
- リンク先・・メディアファイルを選択する
- サイズ・・表示させたいサイズにする
この設定で 投稿に挿入 をクリックします。それがこちら↓
この上の画像クリックしてみて♪
ボヨーンってなりましたよね！（スマホでは表示の大きさに限りがありますが・・）
比較するために640×410の画像も用意したので挿入してみました。
この画像はリンク先をメディアファイルにせず、「なし」のままにしていますのでクリックもできません。
薬がおいてありますけど、さっきの拡大できた画像の方が文字がしっかり読めますね！
やはり説明が入っている画像などは大きくなったほうがみやすいです。
プラグインはいらない
初めはプラグインを入れないとできないのかな？と思ってたんですけど、入れずにできました。
もしかしたらテーマによって違ったりするかもしれませんが、まずはプラグインインストールの手間が必要ないこの方法で試してみてくださいねー！
まとめ
大きすぎると重たいし、表示もおかしくなる画像・・。とはいえ大きく見せたい時だってありますよね。
ワードプレスでは画像をクリックしたら拡大するようにする設定も覚えてしまえば簡単です。
画像を使った解説なども記事上でやりやすくなりますし便利なのでどんどんクリックでボヨンって大きくなる画像を活用してくださいね！
※テーマは無料のCocoonを使用しています。
コメント