インスタグラムのAPIを利用して一覧を表示


自分以外のインスタグラム投稿一覧をWebサイトに埋め込みました。
いろんなサイトを参考にさせていただいたので、今後同じ作業をするときに忘れそうなのでメモしておきます。

インスタグラムの投稿一覧を取得してカスタマイズして表示させたかったので、APIを使用する必要がありました。

「InstagramのAPIで簡単な投稿を取得する」ためのアクセストークン取得方法を紹介
を参考にしてアクセストークンを取得します。

InstagramのAPI使用が超厳しくなったので、手順をもう一度さらっておく。
を参考にして取得するユーザーさんを登録しました。
ユーザーさんからの承認がとれれば、表示することが可能です。
ユーザーさんが承認するには、ユーザーさんもデベロッパー画面から承認する必要があります。
下記ページの「追加ユーザーの承認作業」をから「Accept」ボタンを押すだけです。
Instagramでアプリ作成時にSandboxの検証ユーザーを追加する方法

InstagramのAPI使用が超厳しくなったので、手順をもう一度さらっておく。
に戻ってuser_id を取得します。
取得したuser_idを使って、下記のようにPHPに記載して読み込みできました。

                <ul>
                    <?php
                    $user_id = 'XXXXXXXXXX'; //ユーザーID
                    $access_token = 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'; //自分のアクセストークン
                    $count = '6'; //表示したい数
                    $url = 'https://api.instagram.com/v1/users/'.$user_id.'/media/recent/?access_token='.$access_token.'&count='.$count;
                    $array = json_decode(file_get_contents($url), true);
                    //echo var_dump($array);

                    foreach($array['data'] as $data){
                        $img = $data['images']['thumbnail'];
                    ?>
                    <li>
                        <a href="<?php echo $data['link'] ?>" target="_blank">
                            <img src="<?php echo $img['url']; ?>" alt="">
                        </a>
                    </li>
                    <?php
                    }
                    ?>
                </ul>

スポンサーリンク
ad
ad

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
ad