Image optimisation

Hey myput,

We don’t set the width and height attributes on the image element in the HTML itself as we set it using CSS. We do this as the feed is responsive and so the images size changes based on which device you view them on. I can do some testing in the next update to see whether it’s feasible for us to add the width and height into the HTML and still maintain the responsive sizing.

In the meantime, if you’d like to add them in manually then I can give you directions on how to edit the plugin source code to add them in if you like, although it may affect the responsive layout of the feed.

John

Wondering if there’s been a solution to this. I get a very poor rating on the pagespeed element “specify image dimensions” almost solely due to the instagram images. Have you been able to look into setting the width and height attributes?

Hey Jon,

Our developer is still working on a permanent solution but you can add a width and height manually in the mean time. Here’s how you can add it manually right now:

On line 114 of sb-instagram.js add the width and height part in bold:

template: ‘<div class=”sbi_item sbi_type_{{model.type}} sbi_new” id=”sbi_{{id}}” data-date=”{{model.created_time_raw}}”><div class=”sbi_photo_wrap”><img src=”{{image}}” alt=”{{caption}}” width=”100″ height=”100″ /></div></div>’,