Instagram Gallery - Version 3.0.6

Version Description

  • Fix. carousel media files
Download this release

Release Info

Developer quadlayers
Plugin Icon 128x128 Instagram Gallery
Version 3.0.6
Comparing to
See all releases

Code changes from version 3.0.4 to 3.0.6

Files changed (7) hide show
  1. assets/frontend/js/qligg.min.js +335 -1
  2. includes/api/apiFeed.php +9 -3
  3. includes/models/Feed.php +2 -1
  4. includes/view/backend/pages/modals/feed/panel-feed-image.php +13 -6
  5. insta-gallery.php +2 -2
  6. readme.txt +8 -2
  7. templates/item/item-image.php +1 -1
assets/frontend/js/qligg.min.js CHANGED
@@ -1 +1,335 @@
1
- !function($){"use strict";var swiper_index=0,$swipers={};function qligg_load_item_images($item,next_max_id){var $wrap=$(".insta-gallery-list",$item),$spinner=$(".insta-gallery-spinner",$item),feed=$item.data("feed");$.ajax({url:qligg.ajax_url,type:"post",timeout:3e4,data:{action:"qligg_load_item_images",next_max_id:next_max_id,feed:JSON.stringify(feed)},beforeSend:function(){$spinner.show()},success:function(response){if(!0!==response.success)return $wrap.append($(response.data)),void $spinner.hide();var $images=$(response.data);$wrap.append($images).trigger("qligg.loaded",[$images])},complete:function(){},error:function(jqXHR,textStatus){$spinner.hide(),console.log(textStatus)}})}$(".insta-gallery-feed").on("qligg.loaded",(function(e,images){var $item=$(e.delegateTarget),$wrap=$(".insta-gallery-list",$item),$spinner=$(".insta-gallery-spinner",$item),$button=$(".insta-gallery-button.load",$item),options=$item.data("feed"),total=$(images).length,loaded=0;total&&$wrap.find(".insta-gallery-image").load((function(e){++loaded>=total&&$wrap.trigger("qligg.imagesLoaded",[images])})),total<options.limit&&($spinner.hide(),setTimeout((function(){$button.fadeOut()}),300))})),$(".insta-gallery-feed").on("qligg.imagesLoaded",(function(e){var $item=$(e.delegateTarget),$spinner;$(".insta-gallery-spinner",$item).hide()})),$(".insta-gallery-feed[data-feed_layout=gallery]").on("qligg.imagesLoaded",(function(e,images){var $item;$(e.delegateTarget).addClass("loaded"),$(images).each((function(i,item){setTimeout((function(){$(item).addClass("ig-image-loaded")}),150+30*i)}))})),$(".insta-gallery-feed[data-feed_layout=carousel]").on("qligg.imagesLoaded",(function(e,images){var $item;$(e.delegateTarget).addClass("loaded"),$(images).each((function(i,item){$(item).addClass("ig-image-loaded")}))})),$(".insta-gallery-feed[data-feed_layout=carousel]").on("qligg.imagesLoaded",(function(e,images){var $item=$(e.delegateTarget),$swiper=$(".swiper-container",$item),options=$item.data("feed");options.carousel.slides=options.carousel.slidespv,swiper_index++,$swipers[swiper_index]=new Swiper($swiper,{loop:!0,autoHeight:!0,observer:!0,observeParents:!0,slidesPerView:1,spaceBetween:2,autoplay:!!options.carousel.autoplay&&{delay:parseInt(options.carousel.autoplay_interval)},pagination:{el:".swiper-pagination",dynamicBullets:!0,clickable:!0,type:"bullets"},navigation:{nextEl:".swiper-button-next",prevEl:".swiper-button-prev"},breakpoints:{320:{slidesPerView:1,spaceBetween:1},480:{spaceBetween:parseInt(options.spacing),slidesPerView:Math.min(2,parseInt(options.carousel.slides))},768:{spaceBetween:parseInt(options.spacing),slidesPerView:Math.min(3,parseInt(options.carousel.slides))},1024:{spaceBetween:parseInt(options.spacing),slidesPerView:parseInt(options.carousel.slides)}}})})),$(".insta-gallery-feed[data-feed_layout=masonry]").on("qligg.imagesLoaded",(function(e,images){var $item=$(e.delegateTarget),$wrap=$(".insta-gallery-list",$item);$wrap.data("masonry")?$wrap.masonry("appended",images,!1):$wrap.masonry({itemSelector:".insta-gallery-item",isResizable:!0,isAnimated:!1,transitionDuration:0,percentPosition:!0,columnWidth:".insta-gallery-item:last-child"})})),$(".insta-gallery-feed[data-feed_layout=masonry]").on("layoutComplete",(function(e,items){var $item;$(e.delegateTarget).addClass("loaded"),$(items).each((function(i,item){$(item.element).addClass("ig-image-loaded")}))})),$(".insta-gallery-feed").on("qligg.loaded",(function(e){var $item=$(e.delegateTarget),$wrap=$(".insta-gallery-list",$item),options=$item.data("feed");$(".insta-gallery-item .insta-gallery-icon.qligg-icon-instagram",$wrap).on("click",(function(e){e.stopPropagation()})),options.popup.display&&$(".insta-gallery-item",$wrap).magnificPopup({type:"inline",callbacks:{beforeOpen:function(){this.st.mainClass=this.st.mainClass+" qligg-mfp-wrap"},elementParse:function(item){var media="",profile="",counter="",caption="",info="",likes="",date="",comments="";media=item.el.data("item").type&&"video"==item.el.data("item").type?'\n <video autoplay>\n <source src="'+item.el.data("item").videos.standard+'" type="video/mp4">\n </video>':'<img src="'+item.el.data("item").images.standard+'"/>',counter='<div class="mfp-icons"><div class="mfp-counter">'+(item.index+1)+" / "+$(".insta-gallery-item",$wrap).length+'</div><a class="mfp-link" href="'+item.el.data("item").link+'" target="_blank" rel="noopener"><i class="qligg-icon-instagram"></i>Instagram</a></div>',options.popup.profile&&(profile='<div class="mfp-user"><img src="'+options.profile.profile_picture_url+'"><a href="https://www.instagram.com/'+options.profile.username+'" title="'+options.profile.name+'" target="_blank" rel="noopener">'+options.profile.username+"</a></div>"),options.popup.caption&&(caption='<div class="mfp-caption">'+item.el.data("item").caption+"</div>"),item.el.data("item").date&&(date='<div class="mfp-date">'+item.el.data("item").date+"</div>"),item.el.data("item").comments&&options.popup.comments&&(comments='<div class="mfp-comments"><i class="qligg-icon-comment"></i>'+item.el.data("item").comments+"</div>"),item.el.data("item").likes&&options.popup.likes&&(likes='<div class="mfp-likes"><i class="qligg-icon-heart"></i>'+item.el.data("item").likes+"</div>"),(options.popup.likes||options.popup.comments)&&(info='<div class="mfp-info">'+likes+comments+date+"</div>"),item.src='<div class="mfp-figure '+options.popup.align+'">'+media+'<div class="mfp-close"></div><div class="mfp-bottom-bar"><div class="mfp-title">'+profile+counter+caption+info+"</div></div></div>"}},gallery:{enabled:!0}})})),$(".insta-gallery-feed").on("click",".insta-gallery-button.load",(function(e){e.preventDefault();var $item=$(e.delegateTarget),next_max_id;if(!$item.hasClass("loaded"))return!1;qligg_load_item_images($item,$(".insta-gallery-list .insta-gallery-item:last-child",$item).data("item").i)})),$(".insta-gallery-feed").each((function(index,item){var $item=$(item);if($item.hasClass("loaded"))return!1;qligg_load_item_images($item,0)})),-1!=navigator.appVersion.indexOf("MSIE 8.")&&(document.body.className+=" instagal-ie-8"),-1!=navigator.appVersion.indexOf("MSIE 9.")&&(document.body.className+=" instagal-ie-9")}(jQuery);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ (function ($) {
2
+ "use strict";
3
+
4
+ var swiper_index = 0, $swipers = {};
5
+
6
+ // Ajax load
7
+ // ---------------------------------------------------------------------------
8
+
9
+ function qligg_load_item_images($item, next_max_id) {
10
+
11
+ var $wrap = $('.insta-gallery-list', $item),
12
+ $spinner = $('.insta-gallery-spinner', $item),
13
+ feed = $item.data('feed');
14
+
15
+ $.ajax({
16
+ url: qligg.ajax_url,
17
+ type: 'post',
18
+ timeout: 30000,
19
+ data: {
20
+ action: 'qligg_load_item_images',
21
+ next_max_id: next_max_id,
22
+ feed: JSON.stringify(feed)
23
+ },
24
+ beforeSend: function () {
25
+ $spinner.show();
26
+ },
27
+ success: function (response) {
28
+
29
+ if (response.success !== true) {
30
+ $wrap.append($(response.data));
31
+ $spinner.hide();
32
+ return;
33
+ }
34
+ var $images = $(response.data);
35
+
36
+ $wrap.append($images).trigger('qligg.loaded', [$images]);
37
+
38
+ },
39
+ complete: function () {
40
+ },
41
+ error: function (jqXHR, textStatus) {
42
+ $spinner.hide();
43
+ console.log(textStatus);
44
+ }
45
+ });
46
+
47
+ }
48
+
49
+ // Images
50
+ // ---------------------------------------------------------------------------
51
+
52
+ $('.insta-gallery-feed').on('qligg.loaded', function (e, images) {
53
+
54
+ var $item = $(e.delegateTarget),
55
+ $wrap = $('.insta-gallery-list', $item),
56
+ $spinner = $('.insta-gallery-spinner', $item),
57
+ $button = $('.insta-gallery-button.load', $item),
58
+ options = $item.data('feed'),
59
+ total = $(images).length,
60
+ loaded = 0;
61
+ $wrap.trigger('qligg.imagesLoaded', [images]);
62
+
63
+ /* if (total) {
64
+ $wrap.find('.insta-gallery-image').load(function (e) {
65
+ loaded++;
66
+ if (loaded >= total) {
67
+ $wrap.trigger('qligg.imagesLoaded', [images]);
68
+ }
69
+ });
70
+ }*/
71
+
72
+ if (total < options.limit) {
73
+ $spinner.hide();
74
+ setTimeout(function () {
75
+ $button.fadeOut();
76
+ }, 300);
77
+ }
78
+
79
+ });
80
+
81
+ // Spinner
82
+ // ---------------------------------------------------------------------------
83
+
84
+ $('.insta-gallery-feed').on('qligg.imagesLoaded', function (e) {
85
+
86
+ var $item = $(e.delegateTarget),
87
+ $spinner = $('.insta-gallery-spinner', $item);
88
+
89
+ $spinner.hide();
90
+
91
+ });
92
+
93
+ // Gallery
94
+ // ---------------------------------------------------------------------------
95
+
96
+ $('.insta-gallery-feed[data-feed_layout=gallery]').on('qligg.imagesLoaded', function (e, images) {
97
+
98
+ var $item = $(e.delegateTarget);
99
+
100
+ $item.addClass('loaded');
101
+
102
+ $(images).each(function (i, item) {
103
+ setTimeout(function () {
104
+ $(item).addClass('ig-image-loaded');
105
+ }, 150 + (i * 30));
106
+
107
+ });
108
+ });
109
+
110
+ // Carousel
111
+ // ---------------------------------------------------------------------------
112
+
113
+ $('.insta-gallery-feed[data-feed_layout=carousel]').on('qligg.imagesLoaded', function (e, images) {
114
+
115
+ var $item = $(e.delegateTarget);
116
+
117
+ $item.addClass('loaded');
118
+
119
+ $(images).each(function (i, item) {
120
+ //setTimeout(function () {
121
+ $(item).addClass('ig-image-loaded');
122
+ //}, 500 + (i * 50));
123
+
124
+ });
125
+ });
126
+
127
+ $('.insta-gallery-feed[data-feed_layout=carousel]').on('qligg.imagesLoaded', function (e, images) {
128
+
129
+ var $item = $(e.delegateTarget),
130
+ $swiper = $('.swiper-container', $item),
131
+ options = $item.data('feed');
132
+ options.carousel.slides = options.carousel.slidespv;
133
+ /// options.carousel.interval = options.carousel.autoplay_interval;
134
+ swiper_index++;
135
+
136
+ $swipers[swiper_index] = new Swiper($swiper, {
137
+ //direction: 'vertical',
138
+ //wrapperClass: 'insta-gallery-list',
139
+ //slideClass: 'insta-gallery-item',
140
+ loop: true,
141
+ autoHeight: true,
142
+ observer: true,
143
+ observeParents: true,
144
+ slidesPerView: 1,
145
+ spaceBetween: 2,
146
+ autoplay: options.carousel.autoplay ? {
147
+ delay: parseInt(options.carousel.autoplay_interval),
148
+ } : false,
149
+ pagination: {
150
+ el: '.swiper-pagination',
151
+ dynamicBullets: true,
152
+ clickable: true,
153
+ type: 'bullets',
154
+ },
155
+ navigation: {
156
+ nextEl: '.swiper-button-next',
157
+ prevEl: '.swiper-button-prev',
158
+ },
159
+ breakpoints: {
160
+ 320: {
161
+ slidesPerView: 1,
162
+ spaceBetween: 1,
163
+ },
164
+ 480: {
165
+ spaceBetween: parseInt(options.spacing),
166
+ slidesPerView: Math.min(2, parseInt(options.carousel.slides))
167
+ },
168
+ 768: {
169
+ spaceBetween: parseInt(options.spacing),
170
+ slidesPerView: Math.min(3, parseInt(options.carousel.slides))
171
+ },
172
+ 1024: {
173
+ spaceBetween: parseInt(options.spacing),
174
+ slidesPerView: parseInt(options.carousel.slides)
175
+ },
176
+ }
177
+ });
178
+ });
179
+
180
+ // Masonry
181
+ // ---------------------------------------------------------------------------
182
+
183
+ $('.insta-gallery-feed[data-feed_layout=masonry]').on('qligg.imagesLoaded', function (e, images) {
184
+
185
+ var $item = $(e.delegateTarget),
186
+ $wrap = $('.insta-gallery-list', $item);
187
+
188
+ if (!$wrap.data('masonry')) {
189
+ $wrap.masonry({
190
+ itemSelector: '.insta-gallery-item',
191
+ isResizable: true,
192
+ isAnimated: false,
193
+ transitionDuration: 0,
194
+ percentPosition: true,
195
+ columnWidth: '.insta-gallery-item:last-child'
196
+ });
197
+ } else {
198
+ $wrap.masonry('appended', images, false);
199
+ }
200
+ });
201
+
202
+
203
+ $('.insta-gallery-feed[data-feed_layout=masonry]').on('layoutComplete', function (e, items) {
204
+
205
+ var $item = $(e.delegateTarget);
206
+
207
+ $item.addClass('loaded');
208
+
209
+ $(items).each(function (i, item) {
210
+ // setTimeout(function () {
211
+ $(item.element).addClass('ig-image-loaded');
212
+ // }, 500 + (i * 50));
213
+
214
+ });
215
+ });
216
+
217
+ // Popup
218
+ // ---------------------------------------------------------------------------
219
+ $('.insta-gallery-feed').on('qligg.loaded', function (e) {
220
+
221
+ var $item = $(e.delegateTarget),
222
+ $wrap = $('.insta-gallery-list', $item),
223
+ options = $item.data('feed');
224
+
225
+ // Redirect
226
+ // -------------------------------------------------------------------------
227
+ $('.insta-gallery-item .insta-gallery-icon.qligg-icon-instagram', $wrap).on('click', function (e) {
228
+ e.stopPropagation();
229
+ });
230
+
231
+ // Carousel
232
+ // -------------------------------------------------------------------------
233
+ //$('.insta-gallery-item', $wrap).on('mfpOpen', function (e) {
234
+ //});
235
+
236
+ if (!options.popup.display) {
237
+ return;
238
+ }
239
+
240
+ $('.insta-gallery-item', $wrap).magnificPopup({
241
+ type: 'inline',
242
+ callbacks: {
243
+ beforeOpen: function () {
244
+ this.st.mainClass = this.st.mainClass + ' ' + 'qligg-mfp-wrap';
245
+ },
246
+ elementParse: function (item) {
247
+
248
+ var media = '', profile = '', counter = '', caption = '', info = '', likes = '', date = '', comments = '';
249
+
250
+ if (item.el.data('item').type && item.el.data('item').type == 'video') {
251
+ media = '\n\
252
+ <video autoplay>\n\
253
+ <source src="' + item.el.data('item').videos.standard + '" type="video/mp4">\n\
254
+ </video>'
255
+ } else {
256
+ media = '<img src="' + item.el.data('item').images.standard + '"/>'
257
+ }
258
+ counter = '<div class="mfp-icons"><div class="mfp-counter">' + (item.index + 1) + ' / ' + $('.insta-gallery-item', $wrap).length + '</div><a class="mfp-link" href="' + item.el.data('item').link + '" target="_blank" rel="noopener"><i class="qligg-icon-instagram"></i>Instagram</a></div>';
259
+
260
+ if (options.popup.profile) {
261
+ profile = '<div class="mfp-user"><img src="' + options.profile.profile_picture_url + '"><a href="https://www.instagram.com/' + options.profile.username + '" title="' + options.profile.name + '" target="_blank" rel="noopener">' + options.profile.username + '</a></div>';
262
+ }
263
+
264
+ if (options.popup.caption) {
265
+ caption = '<div class="mfp-caption">' + item.el.data('item').caption + '</div>';
266
+ }
267
+
268
+ if (item.el.data('item').date) {
269
+ date = '<div class="mfp-date">' + item.el.data('item').date + '</div>';
270
+ }
271
+
272
+ if (item.el.data('item').comments && options.popup.comments) {
273
+ comments = '<div class="mfp-comments"><i class="qligg-icon-comment"></i>' + item.el.data('item').comments + '</div>';
274
+ }
275
+
276
+ if (item.el.data('item').likes && options.popup.likes) {
277
+ likes = '<div class="mfp-likes"><i class="qligg-icon-heart"></i>' + item.el.data('item').likes + '</div>';
278
+ }
279
+
280
+ if (options.popup.likes || options.popup.comments) {
281
+ info = '<div class="mfp-info">' + likes + comments + date + '</div>';
282
+ }
283
+
284
+ item.src = '<div class="mfp-figure ' + options.popup.align + '">' + media + '<div class="mfp-close"></div><div class="mfp-bottom-bar"><div class="mfp-title">' + profile + counter + caption + info + '</div></div></div>';
285
+ }
286
+ },
287
+ gallery: {
288
+ enabled: true
289
+ }
290
+ });
291
+
292
+ });
293
+
294
+ // Init
295
+ // ---------------------------------------------------------------------------
296
+
297
+ $('.insta-gallery-feed').on('click', '.insta-gallery-button.load', function (e) {
298
+ e.preventDefault();
299
+
300
+ var $item = $(e.delegateTarget);
301
+
302
+ if (!$item.hasClass('loaded')) {
303
+ return false;
304
+ }
305
+
306
+ var next_max_id = $('.insta-gallery-list .insta-gallery-item:last-child', $item).data('item').i;
307
+
308
+ qligg_load_item_images($item, next_max_id);
309
+
310
+ });
311
+
312
+ $('.insta-gallery-feed').each(function (index, item) {
313
+
314
+ var $item = $(item);
315
+
316
+ if ($item.hasClass('loaded')) {
317
+ return false;
318
+ }
319
+
320
+ qligg_load_item_images($item, 0);
321
+
322
+ });
323
+
324
+ // IE8
325
+ // ---------------------------------------------------------------------------
326
+
327
+ if (navigator.appVersion.indexOf("MSIE 8.") != -1) {
328
+ document.body.className += ' ' + 'instagal-ie-8';
329
+ }
330
+ if (navigator.appVersion.indexOf("MSIE 9.") != -1) {
331
+ document.body.className += ' ' + 'instagal-ie-9';
332
+ }
333
+
334
+ })(jQuery);
335
+
includes/api/apiFeed.php CHANGED
@@ -53,8 +53,8 @@ class QLIGG_API_Feed
53
  'media' => $media_url,
54
  'images' => array(
55
  'standard' => $image_url,
56
- 'medium' => "{$item['permalink']}media?size=m",
57
- 'small' => "{$item['permalink']}media?size=t",
58
  ),
59
  'videos' => array(
60
  'standard' => $media_url,
@@ -166,8 +166,10 @@ class QLIGG_API_Feed
166
  function getItemImageURL(array $item = [])
167
  {
168
 
 
169
  if (isset($item['media_type'])) {
170
 
 
171
  switch ($item['media_type']) {
172
  case 'IMAGE':
173
  $image = @$item['media_url'];
@@ -176,7 +178,11 @@ class QLIGG_API_Feed
176
  $image = @$item['thumbnail_url'];
177
  break;
178
  case 'CAROUSEL_ALBUM':
179
- $image = @$item['children']['data'][0]['media_url'];
 
 
 
 
180
  break;
181
  }
182
  }
53
  'media' => $media_url,
54
  'images' => array(
55
  'standard' => $image_url,
56
+ 'medium' => $image_url,
57
+ 'small' => $image_url,
58
  ),
59
  'videos' => array(
60
  'standard' => $media_url,
166
  function getItemImageURL(array $item = [])
167
  {
168
 
169
+
170
  if (isset($item['media_type'])) {
171
 
172
+
173
  switch ($item['media_type']) {
174
  case 'IMAGE':
175
  $image = @$item['media_url'];
178
  $image = @$item['thumbnail_url'];
179
  break;
180
  case 'CAROUSEL_ALBUM':
181
+
182
+ if (!$image = @$item['children']['data'][0]['thumbnail_url']) {
183
+ $image = @$item['children']['data'][0]['media_url'];
184
+ }
185
+
186
  break;
187
  }
188
  }
includes/models/Feed.php CHANGED
@@ -19,7 +19,8 @@ class QLIGG_Feed extends QLIGG_Model
19
  'layout' => 'gallery',
20
  'limit' => 12,
21
  'columns' => 3,
22
- 'resolution' => 'medium',
 
23
  'spacing' => 10,
24
  'highlight' => array(
25
  'tag' => '',
19
  'layout' => 'gallery',
20
  'limit' => 12,
21
  'columns' => 3,
22
+ 'resolution' => 'standard',
23
+ 'lazy' => true,
24
  'spacing' => 10,
25
  'highlight' => array(
26
  'tag' => '',
includes/view/backend/pages/modals/feed/panel-feed-image.php CHANGED
@@ -3,22 +3,21 @@
3
  <div class="options_group">
4
  <p class="form-field">
5
  <label><?php esc_html_e('Images resolution', 'insta-gallery'); ?></label>
6
- <select class="media-modal-render-panels" name="resolution">
7
  <option <# if ( data.resolution=='standard' ) { #>selected="selected"<# } #> value="standard"><?php esc_html_e('Standard', 'insta-gallery'); ?> (1080 x auto)</option>
8
- <option <# if ( data.resolution=='medium' ) { #>selected="selected"<# } #> value="medium"><?php esc_html_e('Medium', 'insta-gallery'); ?> (320 x auto)</option>
9
- <option <# if ( data.resolution=='small' ) { #>selected="selected"<# } #> value="small"><?php esc_html_e('Small', 'insta-gallery'); ?> (150 x 150)</option>
10
  </select>
11
  </p>
12
  </div>
13
 
14
- <# if ( data.resolution!='standard' ) {#>
15
  <div class="disabled-feature options_group">
16
  <p class="form-field">
17
  Unfortunatelly the new Instagram Personal API dosent allow us to recover small and medium images. The new standar size is 1080px and this could cause perfomance issues in the feed load. We strongly recommend to switch to business.
18
  </p>
19
  </div>
20
- <# }#>
21
-
22
  <div class="options_group">
23
  <p class="form-field">
24
  <label><?php esc_html_e('Images spacing', 'insta-gallery'); ?></label>
@@ -27,6 +26,14 @@
27
  </p>
28
  </div>
29
 
 
 
 
 
 
 
 
 
30
  <div class="options_group qligg-premium-field">
31
  <p class="form-field">
32
  <label><?php esc_html_e('Images card', 'insta-gallery'); ?></label>
3
  <div class="options_group">
4
  <p class="form-field">
5
  <label><?php esc_html_e('Images resolution', 'insta-gallery'); ?></label>
6
+ <select class="media-modal-render-panels panel disabled-field" name="resolution">
7
  <option <# if ( data.resolution=='standard' ) { #>selected="selected"<# } #> value="standard"><?php esc_html_e('Standard', 'insta-gallery'); ?> (1080 x auto)</option>
8
+ <!-- <option <# if ( data.resolution=='medium' ) { #>selected="selected"<# } #> value="medium"><?php esc_html_e('Medium', 'insta-gallery'); ?> (320 x auto)</option>
9
+ <option <# if ( data.resolution=='small' ) { #>selected="selected"<# } #> value="small"><?php esc_html_e('Small', 'insta-gallery'); ?> (150 x 150)</option> -->
10
  </select>
11
  </p>
12
  </div>
13
 
14
+
15
  <div class="disabled-feature options_group">
16
  <p class="form-field">
17
  Unfortunatelly the new Instagram Personal API dosent allow us to recover small and medium images. The new standar size is 1080px and this could cause perfomance issues in the feed load. We strongly recommend to switch to business.
18
  </p>
19
  </div>
20
+
 
21
  <div class="options_group">
22
  <p class="form-field">
23
  <label><?php esc_html_e('Images spacing', 'insta-gallery'); ?></label>
26
  </p>
27
  </div>
28
 
29
+ <div class="options_group">
30
+ <p class="form-field">
31
+ <label><?php esc_html_e('Images lazy load', 'insta-gallery'); ?></label>
32
+ <input class="media-modal-render-panels" name="lazy" type="checkbox" value="true" <# if (data.lazy){ #>checked<# } #> />
33
+ <span class="description"><small><?php esc_html_e('Defers feed images loading', 'insta-gallery'); ?></small></span>
34
+ </p>
35
+ </div>
36
+
37
  <div class="options_group qligg-premium-field">
38
  <p class="form-field">
39
  <label><?php esc_html_e('Images card', 'insta-gallery'); ?></label>
insta-gallery.php CHANGED
@@ -4,7 +4,7 @@
4
  * Plugin Name: Social Feed Gallery
5
  * Plugin URI: https://quadlayers.com/portfolio/instagram-feed-gallery/
6
  * Description: Display beautiful and responsive galleries on your website from your Instagram feed account.
7
- * Version: 3.0.4
8
  * Author: QuadLayers
9
  * Author URI: https://quadlayers.com
10
  * License: GPLv3
@@ -19,7 +19,7 @@ if (!defined('QLIGG_PLUGIN_NAME')) {
19
  define('QLIGG_PLUGIN_NAME', 'Social Feed Gallery');
20
  }
21
  if (!defined('QLIGG_PLUGIN_VERSION')) {
22
- define('QLIGG_PLUGIN_VERSION', '3.0.4');
23
  }
24
  if (!defined('QLIGG_PLUGIN_FILE')) {
25
  define('QLIGG_PLUGIN_FILE', __FILE__);
4
  * Plugin Name: Social Feed Gallery
5
  * Plugin URI: https://quadlayers.com/portfolio/instagram-feed-gallery/
6
  * Description: Display beautiful and responsive galleries on your website from your Instagram feed account.
7
+ * Version: 3.0.6
8
  * Author: QuadLayers
9
  * Author URI: https://quadlayers.com
10
  * License: GPLv3
19
  define('QLIGG_PLUGIN_NAME', 'Social Feed Gallery');
20
  }
21
  if (!defined('QLIGG_PLUGIN_VERSION')) {
22
+ define('QLIGG_PLUGIN_VERSION', '3.0.6');
23
  }
24
  if (!defined('QLIGG_PLUGIN_FILE')) {
25
  define('QLIGG_PLUGIN_FILE', __FILE__);
readme.txt CHANGED
@@ -3,8 +3,8 @@ Contributors: quadlayers
3
  Donate link: https://quadlayers.com/portfolio/instagram-gallery/
4
  Tags: Instagram, Instagram feed, Instagram gallery, Instagram photos, Instagram widget, Instagram pictures
5
  Requires at least: 3.4
6
- Tested up to: 5.5.0
7
- Stable tag: 3.0.4
8
  License: GPLv3
9
  License URI: https://www.gnu.org/licenses/gpl-3.0.html
10
 
@@ -105,6 +105,12 @@ There may be some other plugins(like: fancybox, elementor) which also uses image
105
 
106
  == Changelog ==
107
 
 
 
 
 
 
 
108
  = 3.0.4 =
109
  * Fix. small CSS fixes
110
 
3
  Donate link: https://quadlayers.com/portfolio/instagram-gallery/
4
  Tags: Instagram, Instagram feed, Instagram gallery, Instagram photos, Instagram widget, Instagram pictures
5
  Requires at least: 3.4
6
+ Tested up to: 5.5.3
7
+ Stable tag: 3.0.6
8
  License: GPLv3
9
  License URI: https://www.gnu.org/licenses/gpl-3.0.html
10
 
105
 
106
  == Changelog ==
107
 
108
+ = 3.0.6 =
109
+ * Fix. carousel media files
110
+
111
+ = 3.0.5 =
112
+ * Fix. 404 media files
113
+
114
  = 3.0.4 =
115
  * Fix. small CSS fixes
116
 
templates/item/item-image.php CHANGED
@@ -1,6 +1,6 @@
1
  <div class="insta-gallery-image-wrap">
2
  <a class="insta-gallery-link" href="<?php echo esc_url($item['link']); ?>" target="_blank">
3
- <img alt="Instagram" class="insta-gallery-image" src="<?php echo esc_url($image); ?>"/>
4
  <?php if ($feed['mask']['display']): ?>
5
  <?php include($this->template_path('item/item-image-mask.php')); ?>
6
  <?php endif; ?>
1
  <div class="insta-gallery-image-wrap">
2
  <a class="insta-gallery-link" href="<?php echo esc_url($item['link']); ?>" target="_blank">
3
+ <img <?php if($feed['lazy']): echo 'loading="lazy"'; endif; ?> alt="Instagram" class="insta-gallery-image" src="<?php echo esc_url($image); ?>"/>
4
  <?php if ($feed['mask']['display']): ?>
5
  <?php include($this->template_path('item/item-image-mask.php')); ?>
6
  <?php endif; ?>