Instagramにアップしている画像をwebページで表示するためのプラグイン
Instagram APIの仕様変更があり、2016年6月1日より登録制が申告制になった影響で
———————————————————————————————
【注意！】2016年6月1日からInstagram APIの仕様が変わったため、既にインストールしている方は
バージョン1.4.6以上にアップデートした後、アクセストークンを取得し直す必要があります。
———————————————————————————————
とのこと。
【重要】
wordpressのテーマをカスタマイズする場合、footer.phpへ
<script src="<?php bloginfo('url'); ?>/wp-content/plugins/instagram-feed/js/sb-instagram.min.js"></script>
common.jsへAccess Tokenを記述
// instagram ----------------------------------------------
var sb_instagram_js_options = {"sb_instagram_at":"user-Access Token"};
header.phpへcssを記述
<link rel="stylesheet" href="<?php bloginfo('url'); ?>/wp-content/plugins/instagram-feed/css/sb-instagram.css">
【重要】
バージョン1.6まではwp_footer()への出力は無かったがバージョン1.8.3では以下が出力される
<script type="text/javascript"> var sbiajaxurl = "http://xxx.com/wp-admin/admin-ajax.php"; </script>
「type=”text/javascript”」が書き込まれるのでバリデーションチェックにひっかかる
※1.8.3の場合
プラグインのフォルダ内にあるinstagram-feed.php 698行目に出力の記述があるので修正する
固定ページに表示させる場合、テンプレートにループタグが必要
<div id="instagramArea" class="inner"> <?php if(have_posts()):while(have_posts()):the_post(); ?> <div class="pc_block"><?php the_content(); ?></div> <?php endwhile; endif; ?> </div><!--/instagramArea-->
固定ページ編集画面のエディタ内に以下記述 ※ビジュアルエディタではなくテキストエディタを使う！
idはインスタグラムから取得
[instagram-feed id=”xxxxxxxx”]
ダウンロードしたバージョンは1.4.8（2016年10月15日）
プラグインを有効化して設定を行う
※上部にimportant!画面が出るのは、どうも「インスタグラムの仕様変更に伴いAccess TokenとUserIDを再取得しなければならない」という警告っぽい。今回は10月15日時点でのバージョン1.4.8なので再取得というより新規取得になるが、設定を行ってもimportant!表示は消えないからXで非表示にする。
必要なものはインスタグラムのAccess Token（アクセストークン）とUserID
インスタグラムにログインし Authorize をクリックするとAccess TokenとUserIDが表示されるので
プラグイン側に入力し、保存する。
Customizeタブをクリックし、画像の横並び数と表示総数を設定
Headerの項目「Show the Header」のチェックを外すとインスタグラム側のヘッダ表示が消え、画像のみの表示になる。
wordpressでオリジナルテーマを使用している場合は以下をテーマに設定
css
script
<script src="<?php bloginfo('url'); ?>/wp-content/plugins/instagram-feed/js/sb-instagram.min.js"></script>
外部script
var sb_instagram_js_options = {"sb_instagram_at":"Access Token"};
プラグインのダウンロードページにて変更履歴を確認すると、バージョン1.4.6に以下の内容
IMPORTANT: Due to the recent Instagram API changes, in order for the Instagram Feed plugin to continue working after June 1st you must obtain a new Access Token by using the Instagram button on the plugin’s Settings page. This is true even if you recently already obtained a new token. Apologies for any inconvenience.
google翻訳で訳すと以下
重要：近年のInstagramのAPIの変更に、6月1日後に作業を継続するためにプラグインInstagramのフィードためには、あなたはプラグインの設定ページでInstagramのボタンを使用して、新しいアクセストークンを取得する必要があります。これは、あなたが最近すでに新しいトークンを取得した場合も同様です。ご不便をおかけして謝罪。