This simple tutorial will show you how to integrate instafeed.js into your website and display it with Bootstrap 4 and Magnific Popup
Download project files here:
Due to restrictions on Instagram you can only display a specific user’s posts. See this issue on GitHub for more (
Hey Everyone, if this tutorial helped you, please SUBSCRIBE 🙂 It would do me a massive favour! YouTube have changed their rules and I need 400 more subs by Feb 20. If you can subscribe, that would be AWESOME! Cheers
Is this method can work on localhost as well?
Smash Balloon is not free now
thank you!!!
Do you save my life!!!
why use php instead of html?
Hi Its Works Fine – Any way possible to see a Instagram Story ?
Very nice, I would like to add this to a website for a client, however in the github of Instafeed.js it says that the instagram API which allows this to happen is going to finish at 2020
Even after increasing the from 12 to 300. Still only 33 images are coming from Instagram. Do you have any solution for this.
Thanks a lot.
Thank so much
Thank you for the help!
yes its good till yet , but if i need only the business account post in instagram then how can we filter those post accordingly?kindly reply.
great video. thanks! Since Instagram API changed, you can obtain your user id with this: https://github.com/ricardojoserf/instagram-user-id
What if you wanted to update your instagram after uploading it to your website instead?
Hi, do you know how I can display more than 33images? I put the limit to 400 because I am trying to create a tile wall but I am stuck with 33images.
Is it safe to authorize this site to get my token?
thnx bro!
This was such a helpful video and managed to do it too for my first personal site. As a fairly new coder, it was easy to follow as well! 😊
By the way, for anyone wanting to get their UserID from SmashBaloons, follow these instructions:
1. Log-in to your Instagram through the demo they offer.
2. Right click on anyone of your images and click "Inspect"
3. Each image is placed in a div with the same id followed by a line of numbers, an. underscore then a set of 10 numbers afterwards. e. g. sbi=123355789000000000_1234512345
The 2nd set of numbers is your UserId/FeedID.
Hope it makes sense.
Happy New Year! 😊
do you know if its possible to filter out all the videos from your insta feed return? (atm it returns cover pics of the vids, and i dont want that)
thank you so much for this great tutorial, you helped me a lot, even one year and a half after !
much love from a begginer 😉
I'd like to do it on my client's site. How can i get it without token?
Simply great. All I need for my project, and it works like a charm. So satisfying, to see this all come together! What i did to get my images all the same size: add this to the css: .instaimg img { width: 180px; height: 180px;margin-bottom: 30px;}
mine aren't showing up as same height 🙁 idk how to fix it
Worked GREAT. just the user/id thing is outdated, but there are other videos about that. THANX!!!
hey Mr Digital,
i see u use the id tag " <div id='instafeed'></div> " as the place that instagram photo show up, is there is the way to use other tag id to make that photos show up ?
No funciona
How do you got about using a carousel for the images?
Or do you have to include the images seperately to do that?
EDIT: just realised that the images are included seperately using the "template" value in the InstaFeed object.
nice, very thanks
any solution for video?
How would you add a "load more" button? Great vid!
Hello, I should have a question. We develop our e-shop and try to link the instagram feeds with our site (create a gallery of images on a certain hashtag). Despite the instafeedjs, it worked good just for a specific ID. The problem is that I need photos from the entire instagram, which are filtered to a certain hastag eg #KFC. Does anyone have experience with it? Does anyone know how to do it? Or does anyone have a link where the information needed to look for it?
We do not use any CMS due to bad experience, not only in our group, but in general. We write everything from base (HTML, CSS, JS, etc.)
Thank you very much in advance, any answer would help me.
PS: Sry for my bad English :p 😀
is it still possible to get access token now or did Instagram change their policy? tried many things including pixel union
Thank you so much, bud!!
does this cover load more instagram feed?
ok so i got it to work but even if i change the sortBy to random it still only shows the the most recent images on the feed except in random order any suggestions??
Quick and easy. Thanks a lot!