サンプルまとめページはこちら
①基本の使い方 – lightgallery.jsとWordPressの組み合わせ
②アルバムの作り方 – lightgallery.jsとWordPressの組み合わせ
③アルバム複数設置（各アルバムは独立） – lightgallery.jsとWordPressの組み合わせ
④アルバム複数設置（全画像表示） – lightgallery.jsとWordPressの組み合わせ
lightgallery.jsの画像が2枚だけのときスライド方向が逆になる
lightgallery.jsの画像が1枚だけの場合サムネイルが表示されない問題
WordPressの画像情報を取得してlightgallery.jsのキャプションにする
lightgallery.jsのサムネイル画像のサイズを小さくして動作を軽くする←いまここ
lightgallery.jsを使ってWordPressのギャラリーを良い感じに設置する場合、画像IDを取得してサムネイル画像に利用できます。
まずは各サンプルにならって、ギャラリーを取得し、画像IDをゲットします。
そして、wp_get_attachment_image_src($id, "画像サイズ")[0]という関数を使えば、サイズを指定して画像を取得することができます。
したがって、
<a href="<?php echo $src; ?>" data-exthumbimage="<?php echo wp_get_attachment_image_src($id, "thumbnail")[0];?>">
</a>このように、ギャラリーの属性にdata-exthumbimage=サムネイルサイズの画像URLと指定します。
補足
WordPressは、画像をアップロードするとき、オリジナルのサイズだけでなく、自動で大・中・小にリサイズして保存してくれます。
大・中・小の実際の大きさは、管理画面の設定⇒メディアから設定できます。
さらに、functions.phpに追加すれば、任意のサイズを指定することができます。
注意点として、管理画面等からサイズ変更しても、アップロード済の画像はリサイズされません。
アップロード済みの画像をまとめてリサイズできるプラグインがあるので安心してね。
wp_get_attachment_image_src($id, "画像サイズ")[0]とうしろに[0]がついてるのは、wp_get_attachment_image_src()の返り値が配列で、
[0] -> 画像ＵＲＬ
[1] -> 画像幅
[2] -> 画像縦
だからです。