インスタグラムのサイト表示方法

1.ユーザーIDの取得
Find an Instagram User ID
http://www.otzberg.net/iguserid/
 インスタの写真を右クリックURLをコピー>このサイトに貼り付ける
2. アクセストークンを取得
インスタグラムのユーザーページ下APIをクリック
 https://www.instagram.com/developer/

にて登録していく。
 ここで最後にでてくるCLIENT IDと、URLを以下の部分にコピ―してサイトを表示

アクセストークンを入手
 https://api.instagram.com/oauth/authorize/?client_id=「CLIENT ID」&redirect_uri=「REDIRECT URI」&response_type=token

サイトがひょうじされたら、アドレス部分に
 http://www.penguin-dou.com/#access_token=0000000000000

とアクセストークンが表示される。
3.インスタフィードからダウンロード > 表示
instafeed.js
 http://instafeedjs.com/

ヘッダー部分に記述
 ここで、1で取得したUSER IDと、アクセストークンをいれる。
 <!-- Instagram -->
 <script type="text/javascript" src="js/instafeed/instafeed.min.js"></script>
 <script type="text/javascript">
 var feed = new Instafeed({
 get: 'user',
 userId: 2073854337,
 limit: 6,
 resolution: 'low_resolution',
 accessToken: '2073854337.a6d2df7.947fe427d0c24cefa608875f0bed6629',
 template: '<li><a href="{{link}}" target="_blank"><img src="{{image}}" width="200" height="200" /></a></li>'
 });
 feed.run();
 </script>
 <!-- Instagram -->

表示させたい部分に
 <ul id="instafeed"></ul>

を記述。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です