How to add an instagram feed widget to your blog's sidebar or footer that takes you directly to Instagram.
I've had an Instagram widget on my sidebar for as long as I've been blogging. I used Snapwdiget to generate the code for the feed, which was very easy, but it drove me bonkers. Why? Because it took you to snapwidget's website rather than Instagram. Here is what I mean....
When you click on the picture, it doesn't take you to my instagram.com/iamsarahwebb profile. Instead, it takes you to some random snapwidget profile.
Having a reader say, "Ohhh what a lovely picture" to themselves, at their computer screen is all well and good, but you want them to follow you. You want them to like the photo. Well, I assume you do. Bloggers tend to like numbers, particularly on Instagram! Myself included! If you are sending your reader to snapwidget, it is very unlikely you are going to get them to go click crazy in order to find your Instagram.
Instead, I want to be sure to send them right to that image they clicked, on Instagram. Like this...
You also might want to put your instagram feed in grid form, on your blog's footer, like shown below from my design site or you can scroll down and see it on this blog. I'll show you how to do that too!
Let's get started!
Whether you want to add your feed to your blog's footer, or your blog's sidebar head over to the website Instansive.
Enter your details: Instagram username or hashtag. If not using a hashtag, which I doubt you are, just leave that blank. Times you might want to use a hashtag? If you have an Etsy site or are participating in a linkup.
Select "Slideshow"Number of photos - 60Select your image hover effect
Hit preview, then click get code
After you copy that code, proceed to step 3.
To post a grid of your instagram photos at the bottom of your blog... Type of widget - choose gridNumber of columns - up to you, I picked 10Number of rows - up to you, I picked 3Select your image hover effects
Hit preview, then click get code
Go to
LAYOUT in your blogger dashboard.
...For a slideshow on your sidebar...
// Select Add a Gadget on the sidebar //
// Add HTML/Javascript //
//Paste your code, click save //
// Your new instagram slideshow will appear at the top of your sidebar, move it down by dragging and dropping to exactly where you'd like it to appear //
// Click Save Arrangement //
...For a grid on your blog's footer...
// Select Add a Gadget on your blog's footer //
// Add HTML/Javascript //
//Paste your code, click save //
// Your new instagram grid will appear at the top of your footer, move it down by dragging and dropping to exactly where you'd like it to appear //
// Click Save Arrangement //
And that's how it's done! Any questions, leave a comment for me! Want more blog tutorials? Check out my Saturday Sessions page.
You can also follow me on instagram, as a great big thank you, only if you wanna!
You are such an asset to new bloggers! AMAZING LADY!
ReplyDeleteYou the real MVP, Sarah. Always coming in and writing a post exactly when I need something. Heart you so big.
ReplyDeleteTHANK YOU!!! Keep 'em comin'! I don't have any suggestions, because I don't know what I need to know.
ReplyDeleteTHANK YOU!!!! I really wasn't sure how to do this, and I really needed it! I will say, though, that I made adjustments for Wordpress. I followed your steps EXACTLY on Instansive, but then in Wordpress, the steps are as follows:
ReplyDelete1) Within Dashboard, Click on Appearance
2) Click on Widgets
3) Grab and Drag 'text' box to the sidebar or footer sections
4) Title it 'Follow Me On Instagram'
5) past HTML into body of box
6) Click to Save
Voila!
SO EXCITED about this!!
P.S. Totally working on revamping my NEW site, and I am hoping to launch it very soon! YAY!
yassssssssss this is the most handy, thank ya thank ya
ReplyDeleteThank you so much for this!! At one point I completely got rid of my instagram widget because it seemed useless if people couldn't actually follow me from there. Thanks again!
ReplyDeleteThis is SO good. Loving your tutorials!!
ReplyDeleteThank you!! I was not happy with the snap widget! This is so much better!
ReplyDeletethis is the coolest. love it. you're a genius! sharing!
ReplyDeleteYou are genius! Installed!
ReplyDeleteThis was great. I had no idea SnapWidget wasn't taking people to my Instagram. This works for Wordpress too, which I love! I already changed mine. You are a genius!
ReplyDeleteworked perfectly Thank you for an easy fix
ReplyDeleteAgain, your tutorial has saved my life (that may be dramatic, but still...).
ReplyDeleteThank you! I swear if everyone could explain things as well as you can life would be much simpler. You are my blogging hero! :)
I definitely just did this. I've always used Instagme and it's always bothered me that it doesn't go directly to Instagram. Thanks for sharing!
ReplyDeleteThank you! I wasn't thrilled with Snapwidget. This is much better!
ReplyDeleteAndddd now I have an Instagram grid on my blog. Brilliant! Thanks for everything Sarah :)
ReplyDeleteYet again, you swoop in with all the answers. Snapwidget makes me twitchy. But I already instafollow you so you'll just have to settle for a big fat T H A N K Y O U !
ReplyDeleteThis is super helpful, thank you so much for posting!
ReplyDeleteOh my gosh, YOU ARE THE BEST. Thank you so much for this!
ReplyDeleteThank you, thank you.
ReplyDeleteFabulous post! I gave up on clicking on people's insta pics from their blog and hope people take advantage of your advice and how to. Myself included!
ReplyDeleteYou are the best!!! Keep them coming :D
ReplyDeleteOh my, this is great! Updating my widget right now! Thank you! Xo, Stephanie
ReplyDeleteThis is fantastic, thanks for sharing!
ReplyDeleteThank you so much!! This is so much better than snapwidget!
ReplyDeletedone! thank you for this :)
ReplyDeleteis it bad to have two? the sidebar and the one on the footer?
You're awesome, thank you for this... I had totally forgotten that I still had that snapwidget on there... oops!
ReplyDeleteLove this! thanks for the tips!
ReplyDeleteFab thanks for posting! it works perfectly! :-)
ReplyDeleteThank you, thank you, thank you!
ReplyDeleteSo... For me it says "This is free version of our widget. HTTPS is disabled for free widgets. Please upgrade this widget to enable HTTPS." Any idea how to fix that?
ReplyDeleteThis literally made my day. I have been trying to do this forever and hated both Snap and every plugin I tried for months. THANK YOU!!!!!
ReplyDeleteHey Sarah, do you know how i can make the widget full width/screen like yours?? Thank you :)
ReplyDeletehi Sarah. thank you so much for sharing this. i recently did it with snapwidg*t and i think your suggestion much much better. thanks
ReplyDeleteHi Sarah,
ReplyDeleteThanks so much for this tutorial! It was so helpful. I did not like snapwidget at all but I had no idea what else to use. I just decided to start a blog and I'm loving all of your tutorials!
This was exactly what I was searching for since I hated that snapwidget took you to their page. THANK YOU
ReplyDeleteHi, for some reason my pics do not appear square to fill the space, and there is a huge gap even thoguh I chose o pixels between photos... how do I correct that? Thank you!
ReplyDeleteYou might need to select "square crop" and you might need to set the padding to 1 or even 0
DeleteThis doesn't show anything on my blog at all! :O
ReplyDeleteInstead, it shows texts that says I'm using a free version, etc.