Instagram Feed - Version 1.10.2

Version Description

  • Confirmed compatibility with the upcoming WordPress 5.0 "Gutenberg" update
  • Fix: Fixed an issue caused by some themes which affected the formatting of the 'Load More' and 'Follow' buttons
  • Fix: Fixed an occassional formatting issue with error messages due to no line-height being set
  • Fix: Minor admin UI fixes
  • Tweak: Removed mention of some Pro features which will be deprecated due to upcoming Instagram API changes
Download this release

Release Info

Developer smashballoon
Plugin Icon 128x128 Instagram Feed
Version 1.10.2
Comparing to
See all releases

Code changes from version 1.10.1 to 1.10.2

Files changed (11) hide show
  1. README.txt +27 -6
  2. css/sb-instagram-admin.css +8 -5
  3. css/sb-instagram.css +1 -0
  4. css/sb-instagram.min.css +1 -1
  5. img/carousel.png +0 -0
  6. img/grid.png +0 -0
  7. img/highlight.png +0 -0
  8. img/instagram-pro-promo.png +0 -0
  9. img/masonry.png +0 -0
  10. instagram-feed-admin.php +131 -86
  11. instagram-feed.php +4 -4
README.txt CHANGED
@@ -2,8 +2,8 @@
2
  Contributors: smashballoon, craig-at-smash-balloon
3
  Tags: Instagram, Instagram feed, Instagram photos, Instagram widget, Instagram gallery
4
  Requires at least: 3.0
5
- Tested up to: 4.9
6
- Stable tag: 1.10.1
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -11,7 +11,7 @@ Display beautifully clean, customizable, and responsive feeds from multiple Inst
11
 
12
  == Description ==
13
 
14
- Display Instagram photos from any non-private Instagram accounts, either in the same single feed or in multiple different ones.
15
 
16
  = Features =
17
  * Super **simple to set up**
@@ -34,6 +34,22 @@ Display Instagram photos from any non-private Instagram accounts, either in the
34
  * **Keep Your Site Looking Fresh** - Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
35
  * **Super simple to set up** - Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
36
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
37
  = Featured Reviews =
38
  "**Simple and concise** - Excellent plugin. Simple and non-bloated. I had a couple small issues with the plugin when I first started using it, but a quick comment on the support forums got a new version pushed out the next day with the fix. Awesome support!" - [Josh Jones](https://wordpress.org/support/topic/simple-and-concise-3 'Simple and concise Instagram plugin')
39
 
@@ -143,8 +159,6 @@ Yep. You can just separate the IDs by commas, either in the User ID(s) field on
143
 
144
  We've made it super easy. Simply click on the big blue button on the Instagram Feed Settings page and log into your Instagram account. The plugin will then retrieve and display both your Access Token and User ID from Instagram.
145
 
146
- You can also display photos from other peoples Instagram accounts. To find their Instagram User ID you can use [this tool](http://www.otzberg.net/iguserid/).
147
-
148
  = My Instagram feed isn't displaying. Why not!? =
149
 
150
  There are a few common reasons for this:
@@ -287,7 +301,7 @@ We understand that sometimes you need help, have issues or just have questions.
287
 
288
  = What can it do? =
289
 
290
- * Display Instagram photos from any non-private Instagram account.
291
  * Completely responsive and mobile ready –your Instagram feed layout looks great on any screen size and in any container width
292
  * Display multiple Instagram feeds on the same page or on different pages throughout your site by using our powerful Instagram Feed shortcode options
293
  * Display posts from multiple Instagram User IDs
@@ -310,6 +324,13 @@ We understand that sometimes you need help, have issues or just have questions.
310
  * Plus more customization options added all the time!
311
 
312
  == Changelog ==
 
 
 
 
 
 
 
313
  = 1.10.1 =
314
  * Tweak: Automatic image resolution detection setting now works better with wide images. Resizing the browser will now automatically raise the image resolution if needed.
315
  * Fix: Fixed an issue where the Load More button would disappear if all posts for a feed were cached.
2
  Contributors: smashballoon, craig-at-smash-balloon
3
  Tags: Instagram, Instagram feed, Instagram photos, Instagram widget, Instagram gallery
4
  Requires at least: 3.0
5
+ Tested up to: 5.0
6
+ Stable tag: 1.10.2
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
11
 
12
  == Description ==
13
 
14
+ Display Instagram posts from your Instagram accounts, either in the same single feed or in multiple different ones.
15
 
16
  = Features =
17
  * Super **simple to set up**
34
  * **Keep Your Site Looking Fresh** - Automatically push your new Instagram content straight to your site to keep it looking fresh and keeping your audience engaged.
35
  * **Super simple to set up** - Once installed, you can be displaying your Instagram photos within 30 seconds! No confusing steps or Instagram Developer account needed.
36
 
37
+ = Pro Version =
38
+ In order to maintain the free version of the plugin on an ongoing basis, and to provide quick and effective support for free, we offer a Pro version of the plugin. The Pro version allows you to:
39
+
40
+ * Display **Hashtag feeds** (fully compatible with the Instagram December 11, 2018, API changes)
41
+ * View photos and videos in a **popup lightbox** directly on your site
42
+ * View post **comments** for user feeds
43
+ * Display the number of **likes and comments** for each post
44
+ * Create **carousels** from your posts
45
+ * Use **"Masonry" or "Highlight" layouts** for your feeds
46
+ * Display **captions** for photos and videos
47
+ * **Filter posts** based on hashtag/word
48
+ * Advanced **moderation system** for hiding/showing certain posts
49
+ * Create **"shoppable" Instagram feeds**, and more.
50
+
51
+ [Find out more about the Pro version](https://smashballoon.com/instagram-feed/ "Instagram Feed Pro") or [try out the Pro demo](https://smashballoon.com/instagram-feed/demo "Instagram Feed Pro Demo").
52
+
53
  = Featured Reviews =
54
  "**Simple and concise** - Excellent plugin. Simple and non-bloated. I had a couple small issues with the plugin when I first started using it, but a quick comment on the support forums got a new version pushed out the next day with the fix. Awesome support!" - [Josh Jones](https://wordpress.org/support/topic/simple-and-concise-3 'Simple and concise Instagram plugin')
55
 
159
 
160
  We've made it super easy. Simply click on the big blue button on the Instagram Feed Settings page and log into your Instagram account. The plugin will then retrieve and display both your Access Token and User ID from Instagram.
161
 
 
 
162
  = My Instagram feed isn't displaying. Why not!? =
163
 
164
  There are a few common reasons for this:
301
 
302
  = What can it do? =
303
 
304
+ * Display Instagram photos from any Instagram account you own.
305
  * Completely responsive and mobile ready –your Instagram feed layout looks great on any screen size and in any container width
306
  * Display multiple Instagram feeds on the same page or on different pages throughout your site by using our powerful Instagram Feed shortcode options
307
  * Display posts from multiple Instagram User IDs
324
  * Plus more customization options added all the time!
325
 
326
  == Changelog ==
327
+ = 1.10.2 =
328
+ * Confirmed compatibility with the upcoming WordPress 5.0 "Gutenberg" update
329
+ * Fix: Fixed an issue caused by some themes which affected the formatting of the 'Load More' and 'Follow' buttons
330
+ * Fix: Fixed an occassional formatting issue with error messages due to no line-height being set
331
+ * Fix: Minor admin UI fixes
332
+ * Tweak: Removed mention of some Pro features which will be deprecated due to upcoming Instagram API changes
333
+
334
  = 1.10.1 =
335
  * Tweak: Automatic image resolution detection setting now works better with wide images. Resizing the browser will now automatically raise the image resolution if needed.
336
  * Fix: Fixed an issue where the Load More button would disappear if all posts for a feed were cached.
css/sb-instagram-admin.css CHANGED
@@ -750,7 +750,7 @@
750
  padding-top: 5px;
751
  }
752
  #sbi_admin .sbi_user_feed_account_wrap:last-child{
753
- padding-bottom: 15px;
754
  }
755
  #sbi_admin .sbi_user_feed_account_wrap{
756
  padding-bottom: 5px;
@@ -1072,7 +1072,7 @@
1072
  border-radius: 5px;
1073
  box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);
1074
  color: #333;
1075
- z-index: 999;
1076
  font-size: 14px;
1077
  color: #666;
1078
  font-weight: 700;
@@ -1080,8 +1080,10 @@
1080
  border: 1px solid #ccc;
1081
  }
1082
  #sbi_admin .sbi_feed_type .sbi_lock{
1083
- top: -3px;
1084
- left: 100px;
 
 
1085
  color: #999;
1086
  }
1087
  #sbi_admin .sbi_lock:hover,
@@ -1089,7 +1091,7 @@
1089
  background: #fff;
1090
  border: 1px solid #ccc;
1091
  color: #333;
1092
- box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
1093
  }
1094
 
1095
  #sbi_admin .sbi_lock i{
@@ -1103,6 +1105,7 @@
1103
  position: relative;
1104
  }
1105
  #sbi_admin .sbi_pro_tooltip{
 
1106
  display: none;
1107
  position: absolute;
1108
  background: #333;
750
  padding-top: 5px;
751
  }
752
  #sbi_admin .sbi_user_feed_account_wrap:last-child{
753
+ padding-bottom: 10px;
754
  }
755
  #sbi_admin .sbi_user_feed_account_wrap{
756
  padding-bottom: 5px;
1072
  border-radius: 5px;
1073
  box-shadow: 0 0 5px 0 rgba(0,0,0,0.1);
1074
  color: #333;
1075
+ z-index: 99;
1076
  font-size: 14px;
1077
  color: #666;
1078
  font-weight: 700;
1080
  border: 1px solid #ccc;
1081
  }
1082
  #sbi_admin .sbi_feed_type .sbi_lock{
1083
+ height: 18px;
1084
+ padding: 4px 10px 4px 13px;
1085
+ top: 1px;
1086
+ left: 98px;
1087
  color: #999;
1088
  }
1089
  #sbi_admin .sbi_lock:hover,
1091
  background: #fff;
1092
  border: 1px solid #ccc;
1093
  color: #333;
1094
+ box-shadow: 0 0 8px 0 rgba(0,0,0,0.15);
1095
  }
1096
 
1097
  #sbi_admin .sbi_lock i{
1105
  position: relative;
1106
  }
1107
  #sbi_admin .sbi_pro_tooltip{
1108
+ text-align: center;
1109
  display: none;
1110
  position: absolute;
1111
  background: #333;
css/sb-instagram.css CHANGED
@@ -587,6 +587,7 @@
587
  #sb_instagram .sb_instagram_error{
588
  width: 100%;
589
  text-align: center;
 
590
  }
591
 
592
  /* Mod only error msgs */
587
  #sb_instagram .sb_instagram_error{
588
  width: 100%;
589
  text-align: center;
590
+ line-height: 1.4;
591
  }
592
 
593
  /* Mod only error msgs */
css/sb-instagram.min.css CHANGED
@@ -1 +1 @@
1
- #sb_instagram,#sb_instagram.sbi_fixed_height{-webkit-box-sizing:border-box;-moz-box-sizing:border-box}#sb_instagram{width:100%;margin:0 auto;padding:0;box-sizing:border-box}#sb_instagram:after{content:"";display:table;clear:both}#sb_instagram.sbi_fixed_height{overflow:hidden;overflow-y:auto;box-sizing:border-box}#sb_instagram #sbi_images{width:100%;float:left;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}#sb_instagram #sbi_images .sbi_item{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;max-height:1000px;padding:inherit!important;margin:0!important;text-decoration:none;opacity:1;overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;-ms-transition:all .5s ease;transition:all .5s ease}#sb_instagram #sbi_images .sbi_item.sbi_transition{opacity:0;max-height:0}#sb_instagram.sbi_col_1 #sbi_images .sbi_item{width:100%}#sb_instagram.sbi_col_2 #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_3 #sbi_images .sbi_item{width:33.33%}#sb_instagram.sbi_col_4 #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_col_5 #sbi_images .sbi_item{width:20%}#sb_instagram.sbi_col_6 #sbi_images .sbi_item{width:16.66%}#sb_instagram.sbi_col_7 #sbi_images .sbi_item{width:14.28%}#sb_instagram.sbi_col_8 #sbi_images .sbi_item{width:12.5%}#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:11.11%}#sb_instagram.sbi_col_10 #sbi_images .sbi_item{width:10%}#sb_instagram.sbi_col_1.sbi_disable_mobile #sbi_images .sbi_item{width:100%}#sb_instagram.sbi_col_2.sbi_disable_mobile #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_3.sbi_disable_mobile #sbi_images .sbi_item{width:33.33%}#sb_instagram.sbi_col_4.sbi_disable_mobile #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_col_5.sbi_disable_mobile #sbi_images .sbi_item{width:20%}#sb_instagram.sbi_col_6.sbi_disable_mobile #sbi_images .sbi_item{width:16.66%}#sb_instagram.sbi_col_7.sbi_disable_mobile #sbi_images .sbi_item{width:14.28%}#sb_instagram.sbi_col_8.sbi_disable_mobile #sbi_images .sbi_item{width:12.5%}#sb_instagram.sbi_col_9.sbi_disable_mobile #sbi_images .sbi_item{width:11.11%}#sb_instagram.sbi_col_10.sbi_disable_mobile #sbi_images .sbi_item{width:10%}#sb_instagram .sbi_photo_wrap{position:relative}#sb_instagram .sbi_photo{display:block;text-decoration:none}#sb_instagram .sbi_photo img{width:100%;height:auto}#sb_instagram a,#sb_instagram a:active,#sb_instagram a:focus,#sb_instagram a:hover{outline:0}#sb_instagram img{display:block;padding:0!important;margin:0!important;max-width:100%!important;opacity:1!important}#sb_instagram .sbi_link{display:none;position:absolute;bottom:0;right:0;width:100%;padding:10px 0;background:rgba(0,0,0,.5);text-align:center;color:#fff;font-size:12px;line-height:1.1}#sb_instagram .sbi_link a{padding:0 6px;text-decoration:none;color:#fff;font-size:12px;line-height:1.1;display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1}#sb_instagram .sbi_link .sbi_lightbox_link{padding-bottom:5px}#sb_instagram .sbi_link a:focus,#sb_instagram .sbi_link a:hover{text-decoration:underline}#sb_instagram .sbi_photo_wrap:focus .sbi_link,#sb_instagram .sbi_photo_wrap:hover .sbi_link{display:block}#sb_instagram svg:not(:root).svg-inline--fa{height:1em}#sb_instagram .sbi_type_carousel .sbi_playbtn,#sb_instagram .sbi_type_carousel .svg-inline--fa.fa-play,#sb_instagram .sbi_type_video .sbi_playbtn,#sb_instagram .sbi_type_video .svg-inline--fa.fa-play,.sbi_type_carousel .fa-clone{display:block!important;position:absolute;z-index:1;color:#fff;color:rgba(255,255,255,.9);font-style:normal!important;text-shadow:0 0 8px rgba(0,0,0,.8)}#sb_instagram .sbi_type_carousel .sbi_playbtn,#sb_instagram .sbi_type_video .sbi_playbtn{z-index:2;top:50%;left:50%;margin-top:-24px;margin-left:-19px;padding:0;font-size:48px}#sb_instagram .sbi_type_carousel .fa-clone{right:12px;top:12px;font-size:24px;text-shadow:0 0 8px rgba(0,0,0,.3)}#sb_instagram .sbi_type_carousel .svg-inline--fa.fa-play,#sb_instagram .sbi_type_video .svg-inline--fa.fa-play,.sbi_type_carousel svg.fa-clone{-webkit-filter:drop-shadow( 0 0 2px rgba(0,0,0,.4) );filter:drop-shadow( 0 0 2px rgba(0, 0, 0, .4) )}#sb_instagram .sbi_loader{width:20px;height:20px;position:relative;top:50%;left:50%;margin:-10px 0 0 -10px;background-color:#000;background-color:rgba(0,0,0,.5);border-radius:100%;-webkit-animation:sbi-sk-scaleout 1s infinite ease-in-out;animation:sbi-sk-scaleout 1s infinite ease-in-out}#sb_instagram #sbi_load .sbi_loader{position:absolute;margin-top:-11px;background-color:#fff;opacity:1}@-webkit-keyframes sbi-sk-scaleout{0%{-webkit-transform:scale(0)}100%{-webkit-transform:scale(1);opacity:0}}@keyframes sbi-sk-scaleout{0%{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);opacity:0}}#sb_instagram .fa-spin,#sbi_lightbox .fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}#sb_instagram .fa-pulse,#sbi_lightbox .fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}#sb_instagram .sb_instagram_header{float:left;clear:both;margin:0 0 15px;padding:0;line-height:1.2;width:100%}#sb_instagram .sb_instagram_header a{float:left;display:block;min-width:100%\9;transition:color .5s ease;text-decoration:none}@media all and (min-width:480px){#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_img,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_img img{width:80px;height:80px;border-radius:40px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text h3{font-size:20px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info{font-size:14px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text h3{margin-left:95px!important;line-height:1.4}#sb_instagram .sbi_medium .sbi_header_text h3{margin-right:-85px!important}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info{margin-top:4px!important}#sb_instagram .sbi_medium .sbi_header_text.sbi_no_info h3{padding-top:20px!important}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_img,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_img img{width:120px;height:120px;border-radius:60px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text h3{font-size:28px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info{font-size:16px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text h3{margin-left:140px!important;line-height:1.5}#sb_instagram .sbi_large .sbi_header_text h3{margin-right:-120px!important}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info{margin-top:12px!important}#sb_instagram .sbi_large .sbi_header_text.sbi_no_info h3{padding-top:32px!important}}#sb_instagram .sbi_header_img{float:left;position:relative;width:50px;margin:0 0 0 -100%!important;overflow:hidden;-moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px}#sb_instagram .sbi_header_img img{float:left;margin:0!important;padding:0!important;border:none!important;-moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px}#sb_instagram .sbi_header_img_hover i{position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px;width:24px;height:24px;overflow:hidden;background:url(../img/small-logo.png) no-repeat}#sb_instagram .sb_instagram_header .sbi_fade_in{opacity:1;transition:opacity .2s ease-in-out}#sb_instagram .sbi_header_img_hover{position:absolute;width:100%;top:0;bottom:0;left:0;text-align:center;color:#fff;background:rgba(0,0,0,.75);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0;border-radius:40px;transition:opacity .2s}#sb_instagram .sb_instagram_header a:focus .sbi_header_img_hover,#sb_instagram .sb_instagram_header a:hover .sbi_header_img_hover{opacity:1}#sb_instagram .sbi_header_text{float:left;width:100%;padding-top:5px}#sb_instagram .sbi_header_text .sbi_bio,#sb_instagram .sbi_header_text h3{float:left;clear:both;width:auto;margin:0 0 0 60px!important;padding:0!important}#sb_instagram #sbi_load,#sb_instagram .sb_instagram_error{width:100%;text-align:center}#sb_instagram .sb_instagram_header h3{font-size:16px;line-height:1.3}#sb_instagram .sb_instagram_header p{font-size:13px;line-height:1.3}#sb_instagram .sb_instagram_header h3.sbi_no_bio{padding-top:9px!important}#sb_instagram .sbi_header_text img.emoji{margin-right:3px!important}#sb_instagram #sbi_load{float:left;clear:both;opacity:1;transition:all .5s ease-in}#sb_instagram #sbi_load .fa-spinner{display:none;position:absolute;top:50%;left:50%;margin:-8px 0 0 -7px;font-size:15px}#sb_instagram .sbi_load_btn .sbi_btn_text,#sb_instagram .sbi_load_btn .sbi_loader{opacity:1;transition:all .1s ease-in}#sb_instagram .sbi_hidden{opacity:0!important}#sb_instagram #sbi_load .sbi_load_btn,#sb_instagram .sbi_follow_btn a{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;padding:7px 14px;margin:5px auto 0;background:#333;border:none;color:#fff;text-decoration:none;font-size:13px;line-height:1.5;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;transition:all .1s ease-in}#sb_instagram #sbi_load .sbi_load_btn{position:relative}#sb_instagram .sbi_follow_btn{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;text-align:center}#sb_instagram .sbi_follow_btn.sbi_top{display:block;margin-bottom:5px}#sb_instagram .sbi_follow_btn a{background:#408bd1;color:#fff}#sb_instagram #sbi_load .sbi_load_btn:hover{outline:0;box-shadow:inset 0 0 20px 20px rgba(255,255,255,.25)}#sb_instagram .sbi_follow_btn a:focus,#sb_instagram .sbi_follow_btn a:hover{outline:0;box-shadow:inset 0 0 10px 20px #359dff}#sb_instagram #sbi_load .sbi_load_btn.sbi_custom:hover,#sb_instagram .sbi_follow_btn.sbi_custom a:focus,#sb_instagram .sbi_follow_btn.sbi_custom a:hover{box-shadow:inset 0 0 20px 20px rgba(255,255,255,.15)}#sb_instagram #sbi_load .sbi_load_btn:active,#sb_instagram .sbi_follow_btn a:active{box-shadow:inset 0 0 10px 20px rgba(0,0,0,.3)}#sb_instagram .sbi_follow_btn .fa,#sb_instagram .sbi_follow_btn svg{margin-bottom:-1px;margin-right:7px;font-size:15px}#sb_instagram .sbi_follow_btn svg{vertical-align:-.125em}#sb_instagram #sbi_load .sbi_follow_btn{margin-left:5px}#sbi_mod_error{display:none;border:1px solid #ddd;background:#eee;color:#333;margin:0;padding:10px 15px;font-size:13px;text-align:center;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}#sbi_mod_error p{padding:5px 0!important;margin:0!important;line-height:1.3!important}#sbi_mod_error ol,#sbi_mod_error ul{padding:5px 0 5px 20px!important;margin:0!important}#sbi_mod_error li{padding:1px 0!important;margin:0!important}#sbi_mod_error span{font-size:12px}#sb_instagram.sbi_medium .sbi_photo_wrap .svg-inline--fa.fa-play,#sb_instagram.sbi_medium .sbi_playbtn{margin-top:-12px;margin-left:-9px;font-size:23px}#sb_instagram.sbi_medium .sbi_type_carousel .sbi_photo_wrap .fa-clone{right:8px;top:8px;font-size:18px}#sb_instagram.sbi_small .sbi_photo_wrap .svg-inline--fa.fa-play,#sb_instagram.sbi_small .sbi_playbtn{margin-top:-9px;margin-left:-7px;font-size:18px}#sb_instagram.sbi_small .sbi_type_carousel .sbi_photo_wrap .fa-clone{right:5px;top:5px;font-size:12px}@media all and (max-width:640px){#sb_instagram.sbi_col_3 #sbi_images .sbi_item,#sb_instagram.sbi_col_4 #sbi_images .sbi_item,#sb_instagram.sbi_col_5 #sbi_images .sbi_item,#sb_instagram.sbi_col_6 #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_10 #sbi_images .sbi_item,#sb_instagram.sbi_col_7 #sbi_images .sbi_item,#sb_instagram.sbi_col_8 #sbi_images .sbi_item,#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_width_resp{width:100%!important}}@media all and (max-width:480px){#sb_instagram.sbi_col_10 #sbi_images .sbi_item,#sb_instagram.sbi_col_3 #sbi_images .sbi_item,#sb_instagram.sbi_col_4 #sbi_images .sbi_item,#sb_instagram.sbi_col_5 #sbi_images .sbi_item,#sb_instagram.sbi_col_6 #sbi_images .sbi_item,#sb_instagram.sbi_col_7 #sbi_images .sbi_item,#sb_instagram.sbi_col_8 #sbi_images .sbi_item,#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:100%}}
1
+ #sb_instagram,#sb_instagram.sbi_fixed_height{-webkit-box-sizing:border-box;-moz-box-sizing:border-box}#sb_instagram{width:100%;margin:0 auto;padding:0;box-sizing:border-box}#sb_instagram:after{content:"";display:table;clear:both}#sb_instagram.sbi_fixed_height{overflow:hidden;overflow-y:auto;box-sizing:border-box}#sb_instagram #sbi_images{width:100%;float:left;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}#sb_instagram #sbi_images .sbi_item{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;max-height:1000px;padding:inherit!important;margin:0!important;text-decoration:none;opacity:1;overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;-ms-transition:all .5s ease;transition:all .5s ease}#sb_instagram #sbi_images .sbi_item.sbi_transition{opacity:0;max-height:0}#sb_instagram.sbi_col_1 #sbi_images .sbi_item{width:100%}#sb_instagram.sbi_col_2 #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_3 #sbi_images .sbi_item{width:33.33%}#sb_instagram.sbi_col_4 #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_col_5 #sbi_images .sbi_item{width:20%}#sb_instagram.sbi_col_6 #sbi_images .sbi_item{width:16.66%}#sb_instagram.sbi_col_7 #sbi_images .sbi_item{width:14.28%}#sb_instagram.sbi_col_8 #sbi_images .sbi_item{width:12.5%}#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:11.11%}#sb_instagram.sbi_col_10 #sbi_images .sbi_item{width:10%}#sb_instagram.sbi_col_1.sbi_disable_mobile #sbi_images .sbi_item{width:100%}#sb_instagram.sbi_col_2.sbi_disable_mobile #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_3.sbi_disable_mobile #sbi_images .sbi_item{width:33.33%}#sb_instagram.sbi_col_4.sbi_disable_mobile #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_col_5.sbi_disable_mobile #sbi_images .sbi_item{width:20%}#sb_instagram.sbi_col_6.sbi_disable_mobile #sbi_images .sbi_item{width:16.66%}#sb_instagram.sbi_col_7.sbi_disable_mobile #sbi_images .sbi_item{width:14.28%}#sb_instagram.sbi_col_8.sbi_disable_mobile #sbi_images .sbi_item{width:12.5%}#sb_instagram.sbi_col_9.sbi_disable_mobile #sbi_images .sbi_item{width:11.11%}#sb_instagram.sbi_col_10.sbi_disable_mobile #sbi_images .sbi_item{width:10%}#sb_instagram .sbi_photo_wrap{position:relative}#sb_instagram .sbi_photo{display:block;text-decoration:none}#sb_instagram .sbi_photo img{width:100%;height:auto}#sb_instagram a,#sb_instagram a:active,#sb_instagram a:focus,#sb_instagram a:hover{outline:0}#sb_instagram img{display:block;padding:0!important;margin:0!important;max-width:100%!important;opacity:1!important}#sb_instagram .sbi_link{display:none;position:absolute;bottom:0;right:0;width:100%;padding:10px 0;background:rgba(0,0,0,.5);text-align:center;color:#fff;font-size:12px;line-height:1.1}#sb_instagram .sbi_link a{padding:0 6px;text-decoration:none;color:#fff;font-size:12px;line-height:1.1;display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1}#sb_instagram .sbi_link .sbi_lightbox_link{padding-bottom:5px}#sb_instagram .sbi_link a:focus,#sb_instagram .sbi_link a:hover{text-decoration:underline}#sb_instagram .sbi_photo_wrap:focus .sbi_link,#sb_instagram .sbi_photo_wrap:hover .sbi_link{display:block}#sb_instagram svg:not(:root).svg-inline--fa{height:1em}#sb_instagram .sbi_type_carousel .sbi_playbtn,#sb_instagram .sbi_type_carousel .svg-inline--fa.fa-play,#sb_instagram .sbi_type_video .sbi_playbtn,#sb_instagram .sbi_type_video .svg-inline--fa.fa-play,.sbi_type_carousel .fa-clone{display:block!important;position:absolute;z-index:1;color:#fff;color:rgba(255,255,255,.9);font-style:normal!important;text-shadow:0 0 8px rgba(0,0,0,.8)}#sb_instagram .sbi_type_carousel .sbi_playbtn,#sb_instagram .sbi_type_video .sbi_playbtn{z-index:2;top:50%;left:50%;margin-top:-24px;margin-left:-19px;padding:0;font-size:48px}#sb_instagram .sbi_type_carousel .fa-clone{right:12px;top:12px;font-size:24px;text-shadow:0 0 8px rgba(0,0,0,.3)}#sb_instagram .sbi_type_carousel .svg-inline--fa.fa-play,#sb_instagram .sbi_type_video .svg-inline--fa.fa-play,.sbi_type_carousel svg.fa-clone{-webkit-filter:drop-shadow( 0 0 2px rgba(0,0,0,.4) );filter:drop-shadow( 0 0 2px rgba(0, 0, 0, .4) )}#sb_instagram .sbi_loader{width:20px;height:20px;position:relative;top:50%;left:50%;margin:-10px 0 0 -10px;background-color:#000;background-color:rgba(0,0,0,.5);border-radius:100%;-webkit-animation:sbi-sk-scaleout 1s infinite ease-in-out;animation:sbi-sk-scaleout 1s infinite ease-in-out}#sb_instagram #sbi_load .sbi_loader{position:absolute;margin-top:-11px;background-color:#fff;opacity:1}@-webkit-keyframes sbi-sk-scaleout{0%{-webkit-transform:scale(0)}100%{-webkit-transform:scale(1);opacity:0}}@keyframes sbi-sk-scaleout{0%{-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);opacity:0}}#sb_instagram .fa-spin,#sbi_lightbox .fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}#sb_instagram .fa-pulse,#sbi_lightbox .fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}#sb_instagram .sb_instagram_header{float:left;clear:both;margin:0 0 15px;padding:0;line-height:1.2;width:100%}#sb_instagram .sb_instagram_header a{float:left;display:block;min-width:100%\9;transition:color .5s ease;text-decoration:none}@media all and (min-width:480px){#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_img,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_img img{width:80px;height:80px;border-radius:40px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text h3{font-size:20px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info{font-size:14px}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info,#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text h3{margin-left:95px!important;line-height:1.4}#sb_instagram .sbi_medium .sbi_header_text h3{margin-right:-85px!important}#sb_instagram .sb_instagram_header.sbi_medium .sbi_header_text .sbi_bio_info{margin-top:4px!important}#sb_instagram .sbi_medium .sbi_header_text.sbi_no_info h3{padding-top:20px!important}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_img,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_img img{width:120px;height:120px;border-radius:60px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text h3{font-size:28px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info{font-size:16px}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info,#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text h3{margin-left:140px!important;line-height:1.5}#sb_instagram .sbi_large .sbi_header_text h3{margin-right:-120px!important}#sb_instagram .sb_instagram_header.sbi_large .sbi_header_text .sbi_bio_info{margin-top:12px!important}#sb_instagram .sbi_large .sbi_header_text.sbi_no_info h3{padding-top:32px!important}}#sb_instagram .sbi_header_img{float:left;position:relative;width:50px;margin:0 0 0 -100%!important;overflow:hidden;-moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px}#sb_instagram .sbi_header_img img{float:left;margin:0!important;padding:0!important;border:none!important;-moz-border-radius:40px;-webkit-border-radius:40px;border-radius:40px}#sb_instagram .sbi_header_img_hover i{position:absolute;top:50%;left:50%;margin-top:-12px;margin-left:-12px;width:24px;height:24px;overflow:hidden;background:url(../img/small-logo.png) no-repeat}#sb_instagram .sb_instagram_header .sbi_fade_in{opacity:1;transition:opacity .2s ease-in-out}#sb_instagram .sbi_header_img_hover{position:absolute;width:100%;top:0;bottom:0;left:0;text-align:center;color:#fff;background:rgba(0,0,0,.75);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;opacity:0;border-radius:40px;transition:opacity .2s}#sb_instagram .sb_instagram_header a:focus .sbi_header_img_hover,#sb_instagram .sb_instagram_header a:hover .sbi_header_img_hover{opacity:1}#sb_instagram .sbi_header_text{float:left;width:100%;padding-top:5px}#sb_instagram .sbi_header_text .sbi_bio,#sb_instagram .sbi_header_text h3{float:left;clear:both;width:auto;margin:0 0 0 60px!important;padding:0!important}#sb_instagram #sbi_load,#sb_instagram .sb_instagram_error{width:100%;text-align:center;line-height:1.5}#sb_instagram .sb_instagram_header h3{font-size:16px;line-height:1.3}#sb_instagram .sb_instagram_header p{font-size:13px;line-height:1.3}#sb_instagram .sb_instagram_header h3.sbi_no_bio{padding-top:9px!important}#sb_instagram .sbi_header_text img.emoji{margin-right:3px!important}#sb_instagram #sbi_load{float:left;clear:both;opacity:1;transition:all .5s ease-in}#sb_instagram #sbi_load .fa-spinner{display:none;position:absolute;top:50%;left:50%;margin:-8px 0 0 -7px;font-size:15px}#sb_instagram .sbi_load_btn .sbi_btn_text,#sb_instagram .sbi_load_btn .sbi_loader{opacity:1;transition:all .1s ease-in}#sb_instagram .sbi_hidden{opacity:0!important}#sb_instagram #sbi_load .sbi_load_btn,#sb_instagram .sbi_follow_btn a{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;padding:7px 14px;margin:5px auto 0;background:#333;border:none;color:#fff;text-decoration:none;font-size:13px;line-height:1.5;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;transition:all .1s ease-in}#sb_instagram #sbi_load .sbi_load_btn{position:relative}#sb_instagram .sbi_follow_btn{display:-moz-inline-stack;display:inline-block;vertical-align:top;zoom:1;text-align:center}#sb_instagram .sbi_follow_btn.sbi_top{display:block;margin-bottom:5px}#sb_instagram .sbi_follow_btn a{background:#408bd1;color:#fff}#sb_instagram #sbi_load .sbi_load_btn:hover{outline:0;box-shadow:inset 0 0 20px 20px rgba(255,255,255,.25)}#sb_instagram .sbi_follow_btn a:focus,#sb_instagram .sbi_follow_btn a:hover{outline:0;box-shadow:inset 0 0 10px 20px #359dff}#sb_instagram #sbi_load .sbi_load_btn.sbi_custom:hover,#sb_instagram .sbi_follow_btn.sbi_custom a:focus,#sb_instagram .sbi_follow_btn.sbi_custom a:hover{box-shadow:inset 0 0 20px 20px rgba(255,255,255,.15)}#sb_instagram #sbi_load .sbi_load_btn:active,#sb_instagram .sbi_follow_btn a:active{box-shadow:inset 0 0 10px 20px rgba(0,0,0,.3)}#sb_instagram .sbi_follow_btn .fa,#sb_instagram .sbi_follow_btn svg{margin-bottom:-1px;margin-right:7px;font-size:15px}#sb_instagram .sbi_follow_btn svg{vertical-align:-.125em}#sb_instagram #sbi_load .sbi_follow_btn{margin-left:5px}#sbi_mod_error{display:none;border:1px solid #ddd;background:#eee;color:#333;margin:0;padding:10px 15px;font-size:13px;text-align:center;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}#sbi_mod_error p{padding:5px 0!important;margin:0!important;line-height:1.3!important}#sbi_mod_error ol,#sbi_mod_error ul{padding:5px 0 5px 20px!important;margin:0!important}#sbi_mod_error li{padding:1px 0!important;margin:0!important}#sbi_mod_error span{font-size:12px}#sb_instagram.sbi_medium .sbi_photo_wrap .svg-inline--fa.fa-play,#sb_instagram.sbi_medium .sbi_playbtn{margin-top:-12px;margin-left:-9px;font-size:23px}#sb_instagram.sbi_medium .sbi_type_carousel .sbi_photo_wrap .fa-clone{right:8px;top:8px;font-size:18px}#sb_instagram.sbi_small .sbi_photo_wrap .svg-inline--fa.fa-play,#sb_instagram.sbi_small .sbi_playbtn{margin-top:-9px;margin-left:-7px;font-size:18px}#sb_instagram.sbi_small .sbi_type_carousel .sbi_photo_wrap .fa-clone{right:5px;top:5px;font-size:12px}@media all and (max-width:640px){#sb_instagram.sbi_col_3 #sbi_images .sbi_item,#sb_instagram.sbi_col_4 #sbi_images .sbi_item,#sb_instagram.sbi_col_5 #sbi_images .sbi_item,#sb_instagram.sbi_col_6 #sbi_images .sbi_item{width:50%}#sb_instagram.sbi_col_10 #sbi_images .sbi_item,#sb_instagram.sbi_col_7 #sbi_images .sbi_item,#sb_instagram.sbi_col_8 #sbi_images .sbi_item,#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:25%}#sb_instagram.sbi_width_resp{width:100%!important}}@media all and (max-width:480px){#sb_instagram.sbi_col_10 #sbi_images .sbi_item,#sb_instagram.sbi_col_3 #sbi_images .sbi_item,#sb_instagram.sbi_col_4 #sbi_images .sbi_item,#sb_instagram.sbi_col_5 #sbi_images .sbi_item,#sb_instagram.sbi_col_6 #sbi_images .sbi_item,#sb_instagram.sbi_col_7 #sbi_images .sbi_item,#sb_instagram.sbi_col_8 #sbi_images .sbi_item,#sb_instagram.sbi_col_9 #sbi_images .sbi_item{width:100%}}
img/carousel.png ADDED
Binary file
img/grid.png ADDED
Binary file
img/highlight.png ADDED
Binary file
img/instagram-pro-promo.png CHANGED
Binary file
img/masonry.png ADDED
Binary file
instagram-feed-admin.php CHANGED
@@ -475,7 +475,7 @@ function sb_instagram_settings_page() {
475
  <div class="sbi_col sbi_two">
476
  <div class="sbi_user_feed_ids_wrap">
477
  <?php foreach ( $user_feed_ids as $feed_id ) : if ( $feed_id !== '' ) :?>
478
- <div id="sbi_user_feed_id_<?php echo $feed_id; ?>" class="sbi_user_feed_account_wrap">
479
 
480
  <?php if ( isset( $connected_accounts[ $feed_id ] ) && ! empty( $connected_accounts[ $feed_id ]['username'] ) ) : ?>
481
  <strong><?php echo $connected_accounts[ $feed_id ]['username']; ?></strong> <span>(<?php echo $feed_id; ?>)</span>
@@ -485,7 +485,7 @@ function sb_instagram_settings_page() {
485
  <input name="sb_instagram_user_id[]" id="sb_instagram_user_id" type="hidden" value="<?php esc_attr_e( $feed_id ); ?>" />
486
  <?php endif; ?>
487
 
488
- </div>
489
  <?php endif; endforeach; ?>
490
  </div>
491
 
@@ -493,8 +493,8 @@ function sb_instagram_settings_page() {
493
  <p class="sbi_no_accounts" style="margin-top: -3px; margin-right: 10px;">Connect a user account above</p>
494
  <?php endif; ?>
495
 
496
- <a class="sbi_tooltip_link" href="JavaScript:void(0);" style="margin: 0 0 10px 0; display: inline-block; height: 19px;"><?php _e("How to display User feeds"); ?></a>
497
- <div class="sbi_tooltip"><?php _e("<p>In order to display posts from a User account, first connect an account using the button above.</p><p style='padding-top:8px;'><b>Displaying Posts from Other Instagram Accounts</b><br />Due to recent changes in the Instagram API it is no longer possible to display photos from other Instagram accounts which you do not have access to. You can only display the user feed of an account which you connect above. You can connect as many account as you like by logging in using the button above, or manually copy/pasting an Access Token by selecting the 'Manually Connect an Account' option.</p><p style='padding-top:10px;'><b>Multiple Acounts</b><br />It is only possible to display feeds from Instagram accounts which you own. In order to display feeds from multiple accounts, first connect them above and then use the buttons to add the account either to your primary feed or to another feed on your site.</p>", 'instagram-feed'); ?></div><br />
498
  </div>
499
 
500
  </div>
@@ -505,46 +505,14 @@ function sb_instagram_settings_page() {
505
  <label class="sbi_radio_label" for="sb_instagram_type_hashtag"><?php _e( 'Hashtag:', 'instagram-feed' ); ?></label>
506
  </div>
507
  <div class="sbi_col sbi_two">
508
- <input readonly type="text" size="25" />
509
- &nbsp;<a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);"><?php _e( 'What is this?', 'instagram-feed' ); ?></a>
510
-
511
- <!-- <span class="sbi_note"> - <a href="https://smashballoon.com/instagram-feed/" target="_blank">Upgrade to Pro to show posts by Hashtag</a></span> -->
512
-
513
- <p class="sbi_tooltip"><?php _e( 'Display posts from a specific hashtag instead of from a user', 'instagram-feed' ); ?></p>
514
- </div>
515
- </div>
516
 
517
- <div class="sbi_pro sbi_row">
518
- <div class="sbi_col sbi_one">
519
- <input type="radio" name="sb_instagram_type" disabled="">
520
- <label class="sbi_radio_label"><?php _e( 'Single:', 'instagram-feed' ); ?></label>
521
- </div>
522
- <div class="sbi_col sbi_two">
523
-
524
- <p class="sbi_pro_tooltip">Upgrade to the Pro version to display hashtag, single post, or location feeds.<i class="fa fa-caret-down" aria-hidden="true"></i></p>
525
  <a href="https://smashballoon.com/instagram-feed/" target="_blank" class="sbi_lock"><i class="fa fa-rocket"></i>Pro</a>
526
 
527
- <input readonly type="text" size="25" />
528
- &nbsp;<a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);"><?php _e( 'What is this?', 'instagram-feed' ); ?></a>
529
-
530
- <!-- <span class="sbi_note"> - <a href="https://smashballoon.com/instagram-feed/" target="_blank">Upgrade to Pro to show single posts</a></span> -->
531
-
532
- <p class="sbi_tooltip"><?php _e("Display a feed comprised of specific single posts."); ?></p>
533
- </div>
534
- </div>
535
-
536
- <div class="sbi_pro sbi_row">
537
- <div class="sbi_col sbi_one">
538
- <input disabled type="radio" name="sb_instagram_type" id="sb_instagram_type_location" value="location" <?php if($sb_instagram_type == "location") echo "checked"; ?> />
539
- <label class="sbi_radio_label" for="sb_instagram_type_location"><?php _e( 'Location:', 'instagram-feed' ); ?></label>
540
- </div>
541
- <div class="sbi_col sbi_two">
542
- <input readonly type="text" size="25" />
543
  &nbsp;<a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);"><?php _e( 'What is this?', 'instagram-feed' ); ?></a>
544
 
545
- <!-- <span class="sbi_note"> - <a href="https://smashballoon.com/instagram-feed/" target="_blank">Upgrade to Pro to show posts by Location</a></span> -->
546
-
547
- <p class="sbi_tooltip"><?php _e( 'Display posts from an Instagram location ID or location coordinates.', 'instagram-feed' ); ?></p>
548
  </div>
549
  </div>
550
 
@@ -553,7 +521,7 @@ function sb_instagram_settings_page() {
553
  <a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);" style="margin-left: 0;"><i class="fa fa-question-circle" aria-hidden="true" style="margin-right: 6px;"></i><?php _e('Combine multiple feed types into a single feed', 'instagram-feed'); ?></a>
554
  <p class="sbi_tooltip">
555
  <b>Please note: this is only available in the <a href="https://smashballoon.com/instagram-feed/" target="_blank">Pro version</a>.</b><br />
556
- <?php echo sprintf( __('To display multiple feed types in a single feed, use %s in your shortcode and then add each user name, hashtag, location, or single post of each feed into the shortcode, like so: %s. This will combine a user feed and a hashtag feed into the same feed.', 'instagram-feed'), 'type="mixed"', '<code>[instagram-feed type="mixed" user="smashballoon" hashtag="#awesomeplugins"]</code>' ); ?>
557
  </p>
558
  </div>
559
 
@@ -685,7 +653,7 @@ function sb_instagram_settings_page() {
685
  </div>
686
  <?php endforeach; ?>
687
 
688
- <p class="sbi_pro_tooltip">Upgrade to the Pro version to unlock these layouts.<i class="fa fa-caret-down" aria-hidden="true"></i></p>
689
  <a href="https://smashballoon.com/instagram-feed/" target="_blank" class="sbi_lock"><i class="fa fa-rocket"></i>Pro</a>
690
 
691
  </div>
@@ -1560,8 +1528,8 @@ function sb_instagram_settings_page() {
1560
  </tr>
1561
  <tr class="sbi_pro">
1562
  <td>type</td>
1563
- <td><?php _e("Display photos from a User ID (user)<br />Display posts from a Hashtag (hashtag)<br />Display posts from a Location (location)<br />Display posts from Coordinates (coordinates)", 'instagram-feed'); ?></td>
1564
- <td><code>[instagram-feed type=user]</code><br /><code>[instagram-feed type=hashtag]</code><br/><code>[instagram-feed type=location]</code><br /><code>[instagram-feed type=coordinates]</code></td>
1565
  </tr>
1566
  <tr>
1567
  <td>id</td>
@@ -1573,16 +1541,6 @@ function sb_instagram_settings_page() {
1573
  <td><?php _e('Any hashtag. Separate multiple IDs by commas.', 'instagram-feed'); ?></td>
1574
  <td><code>[instagram-feed hashtag="#awesome"]</code></td>
1575
  </tr>
1576
- <tr class="sbi_pro">
1577
- <td>location</td>
1578
- <td><?php _e('The ID of the location. Separate multiple IDs by commas.', 'instagram-feed'); ?></td>
1579
- <td><code>[instagram-feed location="213456451"]</code></td>
1580
- </tr>
1581
- <tr class="sbi_pro">
1582
- <td>coordinates</td>
1583
- <td><?php _e('The coordinates to display photos from. Separate multiple sets of coordinates by commas.<br />The format is (latitude,longitude,distance).', 'instagram-feed'); ?></td>
1584
- <td><code>[instagram-feed coordinates="(25.76,-80.19,500)"]</code></td>
1585
- </tr>
1586
 
1587
  <tr class="sbi_table_header"><td colspan=3><?php _e("Customize Options", 'instagram-feed'); ?></td></tr>
1588
  <tr>
@@ -1616,26 +1574,31 @@ function sb_instagram_settings_page() {
1616
  <td><code>[instagram-feed class=feedOne]</code></td>
1617
  </tr>
1618
 
1619
- <tr class="sbi_table_header"><td colspan=3><?php _e("Photos Options", 'instagram-feed'); ?></td></tr>
1620
  <tr>
1621
- <td>sortby</td>
1622
- <td><?php _e("Sort the posts by Newest to Oldest (none) or Random (random)", 'instagram-feed'); ?></td>
1623
- <td><code>[instagram-feed sortby=random]</code></td>
1624
  </tr>
1625
  <tr>
1626
  <td>num</td>
1627
  <td><?php _e("The number of photos to display initially. Maximum is 33.", 'instagram-feed'); ?></td>
1628
  <td><code>[instagram-feed num=10]</code></td>
1629
  </tr>
 
 
 
 
 
1630
  <tr>
1631
  <td>cols</td>
1632
  <td><?php _e("The number of columns in your feed. 1 - 10.", 'instagram-feed'); ?></td>
1633
  <td><code>[instagram-feed cols=5]</code></td>
1634
  </tr>
1635
  <tr>
1636
- <td>imageres</td>
1637
- <td><?php _e("The resolution/size of the photos. 'auto', full', 'medium' or 'thumb'.", 'instagram-feed'); ?></td>
1638
- <td><code>[instagram-feed imageres=full]</code></td>
1639
  </tr>
1640
  <tr>
1641
  <td>imagepadding</td>
@@ -1647,34 +1610,17 @@ function sb_instagram_settings_page() {
1647
  <td><?php _e("The unit of the padding. 'px' or '%'", 'instagram-feed'); ?></td>
1648
  <td><code>[instagram-feed imagepaddingunit=px]</code></td>
1649
  </tr>
1650
- <tr class="sbi_pro">
1651
- <td>disablelightbox</td>
1652
- <td><?php _e("Whether to disable the photo Lightbox. It is enabled by default.", 'instagram-feed'); ?></td>
1653
- <td><code>[instagram-feed disablelightbox=true]</code></td>
1654
- </tr>
1655
- <tr>
1656
- <td>disablemobile</td>
1657
- <td><?php _e("Disable the mobile layout. 'true' or 'false'.", 'instagram-feed'); ?></td>
1658
- <td><code>[instagram-feed disablemobile=true]</code></td>
1659
- </tr>
1660
 
 
1661
  <tr class="sbi_pro">
1662
- <td>hovercolor</td>
1663
- <td><?php _e("The background color when hovering over a photo. Any hex color code.", 'instagram-feed'); ?></td>
1664
- <td><code>[instagram-feed hovercolor=#ff0000]</code></td>
1665
  </tr>
1666
  <tr class="sbi_pro">
1667
- <td>hovertextcolor</td>
1668
- <td><?php _e("The text/icon color when hovering over a photo. Any hex color code.", 'instagram-feed'); ?></td>
1669
- <td><code>[instagram-feed hovertextcolor=#fff]</code></td>
1670
- </tr>
1671
-
1672
-
1673
- <tr class="sbi_table_header"><td colspan=3><?php _e("Carousel Options", 'instagram-feed'); ?></td></tr>
1674
- <tr class="sbi_pro">
1675
- <td>carousel</td>
1676
- <td><?php _e("Display this feed as a carousel", 'instagram-feed'); ?></td>
1677
- <td><code>[instagram-feed carousel=true]</code></td>
1678
  </tr>
1679
  <tr class="sbi_pro">
1680
  <td>carouselarrows</td>
@@ -1697,6 +1643,93 @@ function sb_instagram_settings_page() {
1697
  <td><code>[instagram-feed carouseltime=8000]</code></td>
1698
  </tr>
1699
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1700
  <tr class="sbi_table_header"><td colspan=3><?php _e("Header Options", 'instagram-feed'); ?></td></tr>
1701
  <tr>
1702
  <td>showheader</td>
@@ -1814,6 +1847,18 @@ function sb_instagram_settings_page() {
1814
  <td><code>[instagram-feed includewords="sunshine"]</code></td>
1815
  </tr>
1816
 
 
 
 
 
 
 
 
 
 
 
 
 
1817
  </tbody>
1818
  </table>
1819
 
@@ -1840,7 +1885,7 @@ function sb_instagram_settings_page() {
1840
  <span class="sbi-support-title"><i class="fa fa-youtube-play" aria-hidden="true"></i>&nbsp; <a
1841
  href="https://www.youtube.com/embed/q6ZXVU4g970" target="_blank"
1842
  id="sbi-play-support-video"><?php _e( 'Watch a Video' ); ?></a></span>
1843
- <?php _e( "Watch a short video demonstrating how to set up, customize and use the plugin.<br /><b>Please note</b> that the video shows the set up and use of the <b><a href='https://smashballoon.com/instagram-feed/' target='_blank'>PRO version</a></b> of the plugin, but the process is the same for this free version. The only difference is some of the features available." ); ?>
1844
 
1845
  <iframe id="sbi-support-video"
1846
  src="//www.youtube.com/embed/q6ZXVU4g970?theme=light&amp;showinfo=0&amp;controls=2" width="960"
@@ -1858,8 +1903,8 @@ function sb_instagram_settings_page() {
1858
 
1859
  <ul>
1860
  <li><b>FAQs</b></li>
 
1861
  <li>&bull;&nbsp; <?php _e( '<a href="https://smashballoon.com/my-instagram-access-token-keep-expiring/" target="_blank">My Access Token Keeps Expiring</a>' ); ?></li>
1862
- <li>&bull;&nbsp; <?php _e( '<a href="https://smashballoon.com/my-photos-wont-load/" target="_blank">My Instagram Feed Won\'t Load</a>' ); ?></li>
1863
  <li style="margin-top: 8px; font-size: 12px;"><a href="https://smashballoon.com/instagram-feed/support/faq/" target="_blank">See All<i class="fa fa-chevron-right" aria-hidden="true"></i></a></li>
1864
  </ul>
1865
 
475
  <div class="sbi_col sbi_two">
476
  <div class="sbi_user_feed_ids_wrap">
477
  <?php foreach ( $user_feed_ids as $feed_id ) : if ( $feed_id !== '' ) :?>
478
+ <?php if( count($connected_accounts) > 0 ) { ?><div id="sbi_user_feed_id_<?php echo $feed_id; ?>" class="sbi_user_feed_account_wrap"><?php } ?>
479
 
480
  <?php if ( isset( $connected_accounts[ $feed_id ] ) && ! empty( $connected_accounts[ $feed_id ]['username'] ) ) : ?>
481
  <strong><?php echo $connected_accounts[ $feed_id ]['username']; ?></strong> <span>(<?php echo $feed_id; ?>)</span>
485
  <input name="sb_instagram_user_id[]" id="sb_instagram_user_id" type="hidden" value="<?php esc_attr_e( $feed_id ); ?>" />
486
  <?php endif; ?>
487
 
488
+ <?php if( count($connected_accounts) > 0 ) { ?></div><?php } ?>
489
  <?php endif; endforeach; ?>
490
  </div>
491
 
493
  <p class="sbi_no_accounts" style="margin-top: -3px; margin-right: 10px;">Connect a user account above</p>
494
  <?php endif; ?>
495
 
496
+ <a class="sbi_tooltip_link" href="JavaScript:void(0);" style="margin: 5px 0 10px 0; display: inline-block; height: 19px;"><?php _e("How to display User feeds"); ?></a>
497
+ <div class="sbi_tooltip"><?php _e("<p><b>Displaying Posts from Your User Account</b><br />Simply connect an account using the button above.</p><p style='padding-top:8px;'><b>Displaying Posts from Other Instagram Accounts</b><br />Due to recent changes in the Instagram API it is no longer possible to display photos from other Instagram accounts which you do not have access to. You can only display the user feed of an account which you connect above. You can connect as many account as you like by logging in using the button above, or manually copy/pasting an Access Token by selecting the 'Manually Connect an Account' option.</p><p style='padding-top:10px;'><b>Multiple Acounts</b><br />It is only possible to display feeds from Instagram accounts which you own. In order to display feeds from multiple accounts, first connect them above and then use the buttons to add the account either to your primary feed or to another feed on your site.</p>", 'instagram-feed'); ?></div><br />
498
  </div>
499
 
500
  </div>
505
  <label class="sbi_radio_label" for="sb_instagram_type_hashtag"><?php _e( 'Hashtag:', 'instagram-feed' ); ?></label>
506
  </div>
507
  <div class="sbi_col sbi_two">
 
 
 
 
 
 
 
 
508
 
509
+ <p class="sbi_pro_tooltip">Upgrade to the Pro version to display hashtag feeds<i class="fa fa-caret-down" aria-hidden="true"></i></p>
 
 
 
 
 
 
 
510
  <a href="https://smashballoon.com/instagram-feed/" target="_blank" class="sbi_lock"><i class="fa fa-rocket"></i>Pro</a>
511
 
512
+ <input readonly type="text" size="25" style="height: 32px; top: -2px; position: relative; box-shadow: none;" />
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
513
  &nbsp;<a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);"><?php _e( 'What is this?', 'instagram-feed' ); ?></a>
514
 
515
+ <p class="sbi_tooltip"><?php _e( 'Display posts from a specific hashtag instead of from a user', 'instagram-feed' ); ?></p>
 
 
516
  </div>
517
  </div>
518
 
521
  <a class="sbi_tooltip_link sbi_pro" href="JavaScript:void(0);" style="margin-left: 0;"><i class="fa fa-question-circle" aria-hidden="true" style="margin-right: 6px;"></i><?php _e('Combine multiple feed types into a single feed', 'instagram-feed'); ?></a>
522
  <p class="sbi_tooltip">
523
  <b>Please note: this is only available in the <a href="https://smashballoon.com/instagram-feed/" target="_blank">Pro version</a>.</b><br />
524
+ <?php echo sprintf( __('To display multiple feed types in a single feed, use %s in your shortcode and then add each user name or hashtag of each feed into the shortcode, like so: %s. This will combine a user feed and a hashtag feed into the same feed.', 'instagram-feed'), 'type="mixed"', '<code>[instagram-feed type="mixed" user="smashballoon" hashtag="#awesomeplugins"]</code>' ); ?>
525
  </p>
526
  </div>
527
 
653
  </div>
654
  <?php endforeach; ?>
655
 
656
+ <p class="sbi_pro_tooltip">Upgrade to the Pro version to unlock these layouts<i class="fa fa-caret-down" aria-hidden="true"></i></p>
657
  <a href="https://smashballoon.com/instagram-feed/" target="_blank" class="sbi_lock"><i class="fa fa-rocket"></i>Pro</a>
658
 
659
  </div>
1528
  </tr>
1529
  <tr class="sbi_pro">
1530
  <td>type</td>
1531
+ <td><?php _e("Display photos from a User ID (user)<br />Display posts from a Hashtag (hashtag)", 'instagram-feed'); ?></td>
1532
+ <td><code>[instagram-feed type=user]</code><br /><code>[instagram-feed type=hashtag]</code></td>
1533
  </tr>
1534
  <tr>
1535
  <td>id</td>
1541
  <td><?php _e('Any hashtag. Separate multiple IDs by commas.', 'instagram-feed'); ?></td>
1542
  <td><code>[instagram-feed hashtag="#awesome"]</code></td>
1543
  </tr>
 
 
 
 
 
 
 
 
 
 
1544
 
1545
  <tr class="sbi_table_header"><td colspan=3><?php _e("Customize Options", 'instagram-feed'); ?></td></tr>
1546
  <tr>
1574
  <td><code>[instagram-feed class=feedOne]</code></td>
1575
  </tr>
1576
 
1577
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Layout Options", 'instagram-feed'); ?></td></tr>
1578
  <tr>
1579
+ <td>layout</td>
1580
+ <td><?php _e("How posts are arranged visually in the feed.", 'instagram-feed' ); ?> 'grid', 'carousel', 'masonry', or 'highlight'</td>
1581
+ <td><code>[instagram-feed layout=grid]</code></td>
1582
  </tr>
1583
  <tr>
1584
  <td>num</td>
1585
  <td><?php _e("The number of photos to display initially. Maximum is 33.", 'instagram-feed'); ?></td>
1586
  <td><code>[instagram-feed num=10]</code></td>
1587
  </tr>
1588
+ <tr>
1589
+ <td>nummobile</td>
1590
+ <td><?php _e("The number of photos to display initially for mobile screens (smaller than 480 pixels).", 'instagram-feed'); ?></td>
1591
+ <td><code>[instagram-feed nummobile=6]</code></td>
1592
+ </tr>
1593
  <tr>
1594
  <td>cols</td>
1595
  <td><?php _e("The number of columns in your feed. 1 - 10.", 'instagram-feed'); ?></td>
1596
  <td><code>[instagram-feed cols=5]</code></td>
1597
  </tr>
1598
  <tr>
1599
+ <td>colsmobile</td>
1600
+ <td><?php _e("The number of columns in your feed for mobile screens (smaller than 480 pixels).", 'instagram-feed'); ?></td>
1601
+ <td><code>[instagram-feed colsmobile=2]</code></td>
1602
  </tr>
1603
  <tr>
1604
  <td>imagepadding</td>
1610
  <td><?php _e("The unit of the padding. 'px' or '%'", 'instagram-feed'); ?></td>
1611
  <td><code>[instagram-feed imagepaddingunit=px]</code></td>
1612
  </tr>
 
 
 
 
 
 
 
 
 
 
1613
 
1614
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Carousel Options", 'instagram-feed'); ?></td></tr>
1615
  <tr class="sbi_pro">
1616
+ <td>carouselrows</td>
1617
+ <td><?php _e("Choose 1 or 2 rows of posts in the carousel", 'instagram-feed'); ?></td>
1618
+ <td><code>[instagram-feed carouselrows=1]</code></td>
1619
  </tr>
1620
  <tr class="sbi_pro">
1621
+ <td>carouselloop</td>
1622
+ <td><?php _e("Infinitely loop through posts or rewind", 'instagram-feed'); ?></td>
1623
+ <td><code>[instagram-feed carouselloop=rewind]</code></td>
 
 
 
 
 
 
 
 
1624
  </tr>
1625
  <tr class="sbi_pro">
1626
  <td>carouselarrows</td>
1643
  <td><code>[instagram-feed carouseltime=8000]</code></td>
1644
  </tr>
1645
 
1646
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Highlight Options", 'instagram-feed'); ?></td></tr>
1647
+ <tr class="sbi_pro">
1648
+ <td>highlighttype</td>
1649
+ <td><?php _e("Choose from 3 different ways of highlighting posts.", 'instagram-feed'); ?> 'pattern', 'hashtag', 'id'.</td>
1650
+ <td><code>[instagram-feed highlighttype=hashtag]</code></td>
1651
+ </tr>
1652
+ <tr class="sbi_pro">
1653
+ <td>highlightpattern</td>
1654
+ <td><?php _e("How often a post is highlighted.", 'instagram-feed'); ?></td>
1655
+ <td><code>[instagram-feed highlightpattern=7]</code></td>
1656
+ </tr>
1657
+ <tr class="sbi_pro">
1658
+ <td>highlightoffset</td>
1659
+ <td><?php _e("When to start the highlight pattern.", 'instagram-feed'); ?></td>
1660
+ <td><code>[instagram-feed highlightoffset=3]</code></td>
1661
+ </tr>
1662
+ <tr class="sbi_pro">
1663
+ <td>highlighthashtag</td>
1664
+ <td><?php _e("Highlight posts with these hashtags.", 'instagram-feed'); ?></td>
1665
+ <td><code>[instagram-feed highlighthashtag=best]</code></td>
1666
+ </tr>
1667
+
1668
+
1669
+
1670
+
1671
+
1672
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Photos Options", 'instagram-feed'); ?></td></tr>
1673
+ <tr>
1674
+ <td>sortby</td>
1675
+ <td><?php _e("Sort the posts by Newest to Oldest (none) or Random (random)", 'instagram-feed'); ?></td>
1676
+ <td><code>[instagram-feed sortby=random]</code></td>
1677
+ </tr>
1678
+ <tr>
1679
+ <td>imageres</td>
1680
+ <td><?php _e("The resolution/size of the photos. 'auto', full', 'medium' or 'thumb'.", 'instagram-feed'); ?></td>
1681
+ <td><code>[instagram-feed imageres=full]</code></td>
1682
+ </tr>
1683
+ <tr class="sbi_pro">
1684
+ <td>media</td>
1685
+ <td><?php _e("Display all media, only photos, or only videos", 'instagram-feed'); ?></td>
1686
+ <td><code>[instagram-feed media=photos]</code></td>
1687
+ </tr>
1688
+ <tr class="sbi_pro">
1689
+ <td>disablelightbox</td>
1690
+ <td><?php _e("Whether to disable the photo Lightbox. It is enabled by default.", 'instagram-feed'); ?></td>
1691
+ <td><code>[instagram-feed disablelightbox=true]</code></td>
1692
+ </tr>
1693
+ <tr>
1694
+ <td>disablemobile</td>
1695
+ <td><?php _e("Disable the mobile layout. 'true' or 'false'.", 'instagram-feed'); ?></td>
1696
+ <td><code>[instagram-feed disablemobile=true]</code></td>
1697
+ </tr>
1698
+ <tr class="sbi_pro">
1699
+ <td>captionlinks</td>
1700
+ <td><?php _e("Whether to use urls in captions for the photo's link instead of linking to instagram.com.", 'instagram-feed'); ?></td>
1701
+ <td><code>[instagram-feed captionlinks=true]</code></td>
1702
+ </tr>
1703
+
1704
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Lightbox Comments Options", 'instagram-feed'); ?></td></tr>
1705
+ <tr class="sbi_pro">
1706
+ <td>lightboxcomments</td>
1707
+ <td><?php _e("Whether to show comments in the lightbox for this feed.", 'instagram-feed'); ?></td>
1708
+ <td><code>[instagram-feed lightboxcomments=true]</code></td>
1709
+ </tr>
1710
+ <tr class="sbi_pro">
1711
+ <td>numcomments</td>
1712
+ <td><?php _e("Number of comments to show starting from the most recent.", 'instagram-feed'); ?></td>
1713
+ <td><code>[instagram-feed numcomments=10]</code></td>
1714
+ </tr>
1715
+
1716
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Photos Hover Style Options", 'instagram-feed'); ?></td></tr>
1717
+ <tr class="sbi_pro">
1718
+ <td>hovercolor</td>
1719
+ <td><?php _e("The background color when hovering over a photo. Any hex color code.", 'instagram-feed'); ?></td>
1720
+ <td><code>[instagram-feed hovercolor=#ff0000]</code></td>
1721
+ </tr>
1722
+ <tr class="sbi_pro">
1723
+ <td>hovertextcolor</td>
1724
+ <td><?php _e("The text/icon color when hovering over a photo. Any hex color code.", 'instagram-feed'); ?></td>
1725
+ <td><code>[instagram-feed hovertextcolor=#fff]</code></td>
1726
+ </tr>
1727
+ <tr class="sbi_pro">
1728
+ <td>hoverdisplay</td>
1729
+ <td><?php _e("The info to display when hovering over the photo. Available options:", 'instagram-feed'); ?><br />username, date, instagram, location, caption, likes</td>
1730
+ <td><code>[instagram-feed hoverdisplay="date, location, likes"]</code></td>
1731
+ </tr>
1732
+
1733
  <tr class="sbi_table_header"><td colspan=3><?php _e("Header Options", 'instagram-feed'); ?></td></tr>
1734
  <tr>
1735
  <td>showheader</td>
1847
  <td><code>[instagram-feed includewords="sunshine"]</code></td>
1848
  </tr>
1849
 
1850
+ <tr class="sbi_table_header"><td colspan=3><?php _e("Auto Load More on Scroll", 'instagram-feed'); ?></td></tr>
1851
+ <tr class="sbi_pro">
1852
+ <td>autoscroll</td>
1853
+ <td><?php _e("Load more posts automatically as the user scrolls down the page.", 'instagram-feed'); ?></td>
1854
+ <td><code>[instagram-feed autoscroll=true]</code></td>
1855
+ </tr>
1856
+ <tr class="sbi_pro">
1857
+ <td>autoscrolldistance</td>
1858
+ <td><?php _e("Distance before the end of feed or page that triggers the loading of more posts.", 'instagram-feed'); ?></td>
1859
+ <td><code>[instagram-feed autoscrolldistance=200]</code></td>
1860
+ </tr>
1861
+
1862
  </tbody>
1863
  </table>
1864
 
1885
  <span class="sbi-support-title"><i class="fa fa-youtube-play" aria-hidden="true"></i>&nbsp; <a
1886
  href="https://www.youtube.com/embed/q6ZXVU4g970" target="_blank"
1887
  id="sbi-play-support-video"><?php _e( 'Watch a Video' ); ?></a></span>
1888
+ <?php _e( "Watch a short video demonstrating how to set up, customize and use the plugin.<br /><b>Please note</b> that the video shows the set up and use of the <b><a href='https://smashballoon.com/instagram-feed/' target='_blank'>Pro version</a></b> of the plugin, but the process is the same for this free version. The only difference is some of the features available." ); ?>
1889
 
1890
  <iframe id="sbi-support-video"
1891
  src="//www.youtube.com/embed/q6ZXVU4g970?theme=light&amp;showinfo=0&amp;controls=2" width="960"
1903
 
1904
  <ul>
1905
  <li><b>FAQs</b></li>
1906
+ <li>&bull;&nbsp; <?php _e( '<a href="https://smashballoon.com/my-photos-wont-load/" target="_blank">My Instagram Feed Won\'t Load</a>' ); ?></li>
1907
  <li>&bull;&nbsp; <?php _e( '<a href="https://smashballoon.com/my-instagram-access-token-keep-expiring/" target="_blank">My Access Token Keeps Expiring</a>' ); ?></li>
 
1908
  <li style="margin-top: 8px; font-size: 12px;"><a href="https://smashballoon.com/instagram-feed/support/faq/" target="_blank">See All<i class="fa fa-chevron-right" aria-hidden="true"></i></a></li>
1909
  </ul>
1910
 
instagram-feed.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: Instagram Feed
4
  Plugin URI: https://smashballoon.com/instagram-feed
5
  Description: Display beautifully clean, customizable, and responsive Instagram feeds
6
- Version: 1.10.1
7
  Author: Smash Balloon
8
  Author URI: https://smashballoon.com/
9
  License: GPLv2 or later
@@ -23,7 +23,7 @@ along with this program; if not, write to the Free Software
23
  Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
24
  */
25
 
26
- define( 'SBIVER', '1.10.1' );
27
 
28
  if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
29
 
@@ -248,7 +248,7 @@ function display_instagram($atts, $content = null) {
248
  //Follow button HTML
249
  $sb_instagram_follow_btn_classes = '';
250
  if( strpos($sb_instagram_follow_btn_styles, 'background') !== false ) $sb_instagram_follow_btn_classes = ' sbi_custom';
251
- $sb_instagram_follow_btn_html = '<div class="sbi_follow_btn'.$sb_instagram_follow_btn_classes.'"><a href="https://www.instagram.com/" '.$sb_instagram_follow_btn_styles.' target="_blank"><i class="fa fab fa-instagram"></i>'.esc_html( stripslashes( $sb_instagram_follow_btn_text ) ).'</a></div>';
252
 
253
  //Mobile
254
  $sb_instagram_disable_mobile = $atts['disablemobile'];
@@ -390,7 +390,7 @@ function display_instagram($atts, $content = null) {
390
  $sb_instagram_content .= '>';
391
 
392
  //Load More button
393
- if( $sb_instagram_show_btn && !$sb_instagram_error ) $sb_instagram_content .= '<a class="sbi_load_btn" href="javascript:void(0);" '.$sb_instagram_button_styles.'><span class="sbi_btn_text">' . esc_html( stripslashes( $sb_instagram_load_btn_text ) ).'</span><div class="sbi_loader sbi_hidden"></div></a>';
394
 
395
  //Follow button
396
  if( $sb_instagram_show_follow_btn && !$sb_instagram_error ) $sb_instagram_content .= $sb_instagram_follow_btn_html;
3
  Plugin Name: Instagram Feed
4
  Plugin URI: https://smashballoon.com/instagram-feed
5
  Description: Display beautifully clean, customizable, and responsive Instagram feeds
6
+ Version: 1.10.2
7
  Author: Smash Balloon
8
  Author URI: https://smashballoon.com/
9
  License: GPLv2 or later
23
  Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
24
  */
25
 
26
+ define( 'SBIVER', '1.10.2' );
27
 
28
  if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
29
 
248
  //Follow button HTML
249
  $sb_instagram_follow_btn_classes = '';
250
  if( strpos($sb_instagram_follow_btn_styles, 'background') !== false ) $sb_instagram_follow_btn_classes = ' sbi_custom';
251
+ $sb_instagram_follow_btn_html = '<span class="sbi_follow_btn'.$sb_instagram_follow_btn_classes.'"><a href="https://www.instagram.com/" '.$sb_instagram_follow_btn_styles.' target="_blank"><i class="fa fab fa-instagram"></i>'.esc_html( stripslashes( $sb_instagram_follow_btn_text ) ).'</a></span>';
252
 
253
  //Mobile
254
  $sb_instagram_disable_mobile = $atts['disablemobile'];
390
  $sb_instagram_content .= '>';
391
 
392
  //Load More button
393
+ if( $sb_instagram_show_btn && !$sb_instagram_error ) $sb_instagram_content .= '<a class="sbi_load_btn" href="javascript:void(0);" '.$sb_instagram_button_styles.'><span class="sbi_btn_text">' . esc_html( stripslashes( $sb_instagram_load_btn_text ) ).'</span><span class="sbi_loader sbi_hidden"></span></a>';
394
 
395
  //Follow button
396
  if( $sb_instagram_show_follow_btn && !$sb_instagram_error ) $sb_instagram_content .= $sb_instagram_follow_btn_html;