はじめに
lightgallery.jsにはVer1とVer2があり、商用利用する場合はVer2は有料です。
Ver1公式サイトはこちら
Ver2公式サイトはこちら
最初の設定はlightgallery.js v1 基本の使い方、新しくなったlightgallery.js v2 基本の使い方を見てください。
lightgalleryの記事一覧はこちら
本日の議題は「ギャラリーの画像が1枚だけの場合、サムネイルが表示されない」です。
これは、バグでもなんでもなくて、lighgallery.jsの通常の動作みたいです。
解消するには、lg-thumbnail.js (ver.1.2.0)を修正します。
※バックアップをとり、いつでも戻せるようにしてください。
ソースコード
①23行目付近
//for (var i = 1; i < arguments.length; i++) {
for (var i = 1; i <= arguments.length; i++) {まんなかの<を<=にします。
②86行目付近
//if (this.core.s.thumbnail && this.core.items.length > 1) {
if (this.core.s.thumbnail) { && this.core.items.length > 1を取ります。
③186行目付近
// for (var j = 0; j < _this.core.s.dynamicEl.length; j++) {
for (var j = 0; j <= _this.core.s.dynamicEl.length; j++) {まんなかの<を<=にします。
④227行目付近
//for (var j = 0; j < $thumb.length; j++) {
for (var j = 0; j <= $thumb.length; j++) {まんなかの<を<=にします。
⑤234行目付近
//for (var k = 0; k < $thumb.length; k++) {
for (var k = 0; k <= $thumb.length; k++) {まんなかの<を<=にします。
④475行目付近
//if (this.core.s.thumbnail && this.core.items.length > 1) {
if (this.core.s.thumbnail) { && this.core.items.length > 1を取ります。
おかしくなったら元に戻してね。
参考になりそうなTips
ACFとlightgallery.jsで無限に画像を追加する
Welcartの商品画像とlightgallery.jsの組み合わせ事例
lightgallery.jsの画像が1枚だけの場合サムネイルが表示されない問題
lightgallery.jsのサムネイル画像のサイズを小さくして動作を軽くする
