「Instafeed.js」でInstagramの画像を取得する

「Instafeed.js」でInstagramの画像を取得する

はじめに

Instagramのユーザー数がTwitterのユーザー数を超えたようです。
SNSで世界1位のFacebook、2位のInstagram、両方ともFacebook社の保有ですよね。すごいですな。。
ビジネス利用でInstagramを導入する企業も増えています。
Instagramのエンゲージメント率はなんとFacebookの約10倍らしいです。

Instafeed.jsとは

Webサイト内にInstagramの画像を表示できるようにするプラグインです。
導入もとても簡単です。

ダウンロード

こちらから

デモ

下記ではInstagramの中から、タグ「ラブラドールレトリーバー」を読み込んでいます。

※追記(2016.7.12)
InstagramのAPIの仕様が変わったため、見れなくなっています。

DEMO

ソース

<ul id="instafeed"></ul>
<div id="btn-more">もっと見る</div>
var userFeed = new Instafeed({
  get: '', //取得する情報
  tagName: '', //取得するタグを入力
  limit: '', //表示する数
  clientId: '', //クライアントIDを入力
  template: '' //テンプレートを入力
});
$('#btn-more').click(function() {
  userFeed.next(); //もっと見るボタン
});
userFeed.run();

さいごに

個人的にはテンプレートを編集できるので、カスタマイズがしやすいと思います。
おそらくInstagramのAPI関係では一番使われているプラグインかと思うので、情報が多いのもいいですね。
公式ページは全部英語ですが、そんなに難しい英語は使われていないので、導入の敷居は低いかと思います。
様々なオプションが用意されているので、合わせて使ってみて下さい。