Simple Instafeed JS Tutorial - 2017 (Instagram Feed on Your Website)

Even after increasing the from 12 to 300. Still only 33 images are coming from Instagram. Do you have any solution for this.

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

Hi Its Works Fine - Any way possible to see a Instagram Story ?

why use php instead of html?

thank you!!!
Do you save my life!!!

Smash Balloon is not free now

Is this method can work on localhost as well?

wonderful tutorial thanks

Great example! Learn JS and got to working with API calls, now i have a nice reference to start!

I found this super easy and helpful, thank you.

Great video. Instafeed loads well but I have an error coming from the magnific pop up's min.js. it says "Uncaught TypeError: a is not a function" , and as a result, i think it now also displays another error "magnific pop up is not a function" when i try to call it on gallery. Please any help with this?

Please who knows how to implement this for both videos and images? mine currently displays videos as images.

i got a question. how do i display the images all on the same square with? without bootstrap.

Super helpful! this makes it look so nice thank you

Hi Great Video, but for some reason i cannot see all my images, even though i set the limit up to 200. Anyone can help me?

Thank u myLord!

how do you make the video play when it is on your website?

I'm getting intermittent token expiry - anyone have any resources on renewing your access token from the server? I'm working with c# but any general resource is fine, I'm looking for principles

is this plugin have opportunity to show number of likes or views when user will hover on some images?

Thank you!

Some 3rd party plugins make me dizzy.. this is way easier :) thanks for you tutorial. Amazing!

Does this method still work? 14/10/2019? I couldn't make it work

Thanks for the video.
Does this work for react-native apps?

What if I only want to show tagged images ! , What changes should I make in codes in custom.js!???

Very helpful! Thanks a lot

well, it's not working for me... I've changed the userId and accessToken and still no image shows up

Can confirm as of January 10th 2020, this method works. However if I might just add, its not worth it to add bootstrap to your project just for implementing your instagram feed. The only css you need is less than 10 lines to produce some results.

.insta-rows{
width: 100%;

display: grid;
grid-gap: 1em;
grid-template-columns: 1fr 1fr 1fr;
}
.insta-rows > img{
width: 100%;
height: 100%;
}


Really simple stuff, anyways, the video is still up-to-date.

One note for this method: doesn't look like it works for videos, just photos.


Still, its awesome. I see many paid options online that cost quite a bit. This is a money saver!

Thank you very much for this tutorial. It helped me a lot! I have a question: is it possible to put 2 ID=Instafeed ; 1 for the Standard Monitors and other for mobil Devices?

i have not doing :D

Thank you

Instagram Access Token Generator was deactivated on Pixelunion :/

Instagram Access Token Generator is no longer available... what can i do?

Are you planing a new tutorial with the new Instagram-Facebook regulation API Graph to get the token and apply it to this project? this will be great!

this is exactly what i needed. thanks.

Will This still work in 2020?, because things do get updated.

I need this. Bt how to do for react

Waauw! Awesome video.. You really helped me out here! Like your vibe. Keep it up

but i don't want to pay for this....

thx man very helpfull love it :)

Hello, I really liked your video! I believe that it is the only one that does the integration of magnific popup and instafeed, I would love to see this same expo updated for the year 2022 because there were some restrictions on Instagram. Congratulations on the video!

Question. Is there a way to customize the {{link}} to have each image link to a different custom URL rather than having the images linking back to their respective instagram post? Thanks for this tutorial. It really helped.

hello everyone , i'm wondering about hide access token to be not visible ?how to do it un visible ?

very nice video I tried and it's working thanks bro

From Instafeed JS website:


⚠️ IMPORTANT! Instafeed.js will stop working completely on March 2, 2020.
Instagram will not allow new integrations with instafeed.js.
Before you decide to use instafeed.js, be aware that Instagram is shutting down the API platform that enables instafeed to work, and is not issuing new user access tokens for this API. As of now, instafeed.js works for some common uses (eg. embedding a single user's feed on a web page) as long as you already have a legacy Access Token. It will not work for new integrations or more complex uses (eg. retrieving all public images with a particular hashtag, finding posts based on a location, etc).

The platform API will be turned off completely in 2020, which means that instafeed.js in its current form will stop working then.

We're currently looking at ways to continue the instafeed.js experience with the new APIs, but no solution or road-map has been agreed upon yet.