55,570viewsこんにちは奥田です。今Instagramが流行っていますね。何より手軽に画像をアップできるのがいいですね!サイトに自身のアカウントのFeedを取得して表示したい場合に少しややこしい作業が必要です。今回はざっと流れをご説明したいと思います。IDを取得するアクセストークンを取得するInstafeed.jsを使ってFeedを取得する今回参考にさせていただいたサイトAPI取得用のクライアントを作成するまずInstagramにログインします。ログイン次にプロフィールページへ行き、下部にある「API」というリンクをクリックします。Application」をクリックします。クライアント情報の入力フォームがでてきますので次のように入力します。OAuth」のチェックを外します。入力が完了したらCapcherを入力し、「Resister」を押します。URIs」を使用しますのでどこかにとっておいてください。IDが必要なので以下のサイトで取得します。URL末尾のアカウントIDをコピーし、以下のフォームに貼り付けます。スパム防止のためか計算の答えも入力する必要があるようなので入力します。IDが表示されるのでコピーして同じように取っておいてください。ID」と「REDIRECT_URL」を以下のURLに置換しアクセスします。https://instagram.com/oauth/authorize/?client_id=CLIENT_ID&redirect_uri=REDIRECT_URL&response_type=token以下のような画面になるので「Authorize」をクリックします。「REDIRECT_URL」で設定したページへリダイレクトされます。URL末尾に「#access_token=***」といった感じでaccess_tokenが返ってくるのでこちらをコピーし同じくとっておきましょう。Instafeed.jsを使ってFeedを取得するInstagramのFeedを取得するのに便利なライブラリ「Instafeed.js」を使用します。Instafeed.js以下のように記述すればFeedを取得できます。function(){//取得完了時のコールバック}});feed.run();</script>取得したい箇所で以下の要素を記述し、templateオプションに任意の記述をすることで好きなようにスタイリングできます。id="instafeed"></div>Instafeed.jsテンプレートオプションInstafeed.jsを使用してスライド表示にしたりもできます。いかがだったでしょうか?APIが少し厳格化され、以前のように簡単にFeedを取得する事ができなくなりましたがライブラリを使うと意外と簡単にFeedを取得できます。皆さんも是非試してみてください。menuWorksBlogInformation。