Instafeed.js: Can some JS genius help?

[joshmeares]

[mjk-fi]

You can see the working one here:
http://www.kareinen.fi/photoblog.php

I have this on the head:
<script type="text/javascript" src="js/instafeed.js"></script>

Then this Div where the content should be:
<div id="instafeed" style="padding-left:10px;padding-right:10px;text-align:center;"></div>

And lastly this script somwehere on the page:

    <script type="text/javascript">

    var userFeed = new Instafeed({

        get: 'user',
        userId: 'ID IS FIRST NUMBERS FROM TOKEN BEFORE DOT',
        accessToken: 'GENERATED ACCESS TOKEN',
        template: '<div class="instakoonti"><div class="instakuva"><a href="{{link}}"><img width="195" height="195" src="{{image}}" /></a></div><div class="instakommentit">&#128172; {{comments}} / &#10084; {{likes}}</div></div>',
        resolution: 'low_resolution',
        limit: '20',

    });

    userFeed.run();

    </script>

CSS:

.instakoonti{
    display:inline-block;
    margin:5px;
    border:1px solid #c6c6c6;
    }

.instakuva{

    padding:0px;
    margin:0px;
    background-color:#F0F0F0;

}

.instakommentit{
    background-color:#F0F0F0;
    padding-top:0px;
    padding-bottom:3px;
    margin:0px;
}

[TheTonyStarks]

@mjk-fi , I updated my code to follow what you have. Still no luck for me. Wanted to ask a few things.

1. I'm trying to use a bootstrap template, should that matter?
2. I'm testing this locally on my PC, should that matter?
3. Will 'user' stay as it is or is that replaced by 'kareinen.fi' ( from your example site)?

Thanks

[mjk-fi]

1. I think it shouldn't matter
2. It works locally for me (I tested and opened simple html-file with Chrome)
3. User stays "user"

Do you have the access token made and the user-id is right?

[TheTonyStarks]

I believe so, I followed the steps in the start-up and got the green success box with the id and token from the instafeed.js website.

The userId is the first 8 characters of the accessToken
The accessToken is total 47 characters with 2 (.)

Any other troubleshooting ideas?

[mjk-fi]

Not much, but I uploaded a test packet (one html-file and two javascript-files) here:
https://drive.google.com/open?id=0B1QOcmU3C18eWThCYXVTMzlzV28

Just modify the userid and accesstoken in main.js file.

If that test page doesn't work then you a problem in your access token, browser or server...

[TheTonyStarks]

@mjk-fi - Thanks for all of you help so far. At this point i'm still hitting a wall.

I've taken the files you provided and tried to modify them as you suggested. When I run test.html I just get a blank screen. I've changed the following:

in main.js:

` var userFeed = new Instafeed({

    get: 'user',
    userId: '12345678',
    accessToken: '12345678.XXXXXXX.XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
    template: '<a href="{{link}}"><img src="{{image}}" /></a>',
    resolution: 'low_resolution',
    limit: '20',

});

userFeed.run();

`

So assuming your on the right path with where the issue could be I've created a new access token from scratch.

That brings up 2 new questions:

1. When creating the token, what was your REDIRECT URI. Some tutorials I've seen say use "localhost" others say use "instafeed.js"?

2.Did you get the userId and Accesstoken from from using the link:

https://instagram.com/oauth/authorize/?client_id=YOURCLIENTIDHERE&redirect_uri=HTTP://YOURREDIRECTURLHERE.COM&response_type=token

And replacing the YOURCLIENTIDHERE and HTTP://YOURREDIRECTURLHERE.COM ?

[mjk-fi]

I didn't create access token with Instagram site... Or first I created but I didn't make it right and couldn't get it working. So I went with easier route and I used Pixel Union's access token generator:
http://instagram.pixelunion.net/

[TheTonyStarks]

@ mjk-fi - I think the situation may have been the same. I used the link you provided and I was able to see images on the page.

So 1 last question:
How would I pull all images with a specific hashtag.....like #supercar. Do all post have to be from me?

[stale[bot]]

This issue has been automatically marked as stale because it hasn't had new comments in the last 3 months. It will be closed if no further activity occurs. If you still need assistance with this issue, or believe it shouldn't be closed, please respond with a new comment to let us know.
Thank you all for your contributions.