Display on mobile devices

Hey J.A.

It looks like you may have gotten the feed working like you needed. Did you still need some help with anything?

The feed works, it just does not scale properly on mobile devices. My friend has an iphone 6 plus and the instagram will load 4 pictures and then if they refresh the page, sometimes the other 6 images show up. I have custom code that I pasted below. I guess what I’m really asking is, is there a way for the feed to scale as the size of the screen increases or decreases?

Custom CSS:
@media (max-width: 480px) {
#sb_instagram{ display: none }
}

Custom Javascript:
if( $(window).width() < 600 ){ $(‘#sb_instagram .sbi_item’).slice(4).remove(); }

Thank you for your help!

Hey jasearles,

Sometimes it takes a a little bit of time before the feed completely loads. I’m thinking that your custom code fires just a split second too early most of the time and that is why it is unable to hide all of the images that you are hoping it will. Try adding a delay with this code:

Custom CSS:

@media (max-width: 600px) {
#sb_instagram{ display: none }
}

Custom Javascript:

setTimeout(function(){
  if( $(window).width() > 480 && $(window).width() < 600 ){
    $('#sb_instagram').show().find('.sbi_item').slice(4).remove();
  }
}, 500);

Try that out and let me know if it doesn’t seem to be the case.