Последние фото из инстаграма на PHP

Вы используете блокировщик рекламы

Пожалуйста, отключите блокировщик рекламы

Подробнее

Чтобы вывести последние фото из инстаграма на PHP, необходимо написать 2 функции. В первой мы обратимся к API инстаграма:

    // Get our data
    function fetchData( $url ){
        $ch = curl_init();
        curl_setopt( $ch, CURLOPT_URL, $url );
        curl_setopt( $ch, CURLOPT_RETURNTRANSFER, 1 );
        curl_setopt( $ch, CURLOPT_TIMEOUT, 20 );
        $result = curl_exec( $ch );
        curl_close( $ch );
        return $result;
    }

Во второй — зададим количество фотографий и выведем на страницу результат:

     function instagram_feed( $instagram_token, $instagram_id ) {
        if ( $instagram_token != '' && $instagram_id != '' ){
            // Pull and parse data.
            $result = fetchData( "https://api.instagram.com/v1/users/{$instagram_id}/media/recent/?access_token={$instagram_token}" );
            $result = json_decode( $result );
            $limit = 10; // Amount of images to show
            $i = 0;
 
            foreach ( $result->data as $post ){
                if ( $i < $limit ){
                    echo '<a class="insta-wrap__link" rel="nofollow noopener noreferrer" target="_blank" href="' . $post->link . '">';
                    echo '<img class="insta-wrap__image" src="' . $post->images->thumbnail->url . '" alt="">';
                    echo '</a>';
                    $i ++;
                }
            }
        }
    }

В $post->images->thumbnail->url можно заменить thumbnail на другие значения, чтобы получить фотографии с различным разрешением:

thumbnail — 320*320px;
low_resolution — 150*150px;
standard_resolution — 640*640px;

И, наконец, запускаем функцию вывода там, где нам это нужно:

<div class="instagram-feeds">
    <?php
        $instagram_token = 'xxx';
        $instagram_id = 'xxx';
        if ( $instagram_token !='' && $instagram_id != '' ) { ?>
            <div class="insta-wrap">
                <?php instagram_feed( $instagram_token, $instagram_id ); ?>
            </div>
        <?php }
    ?>
</div>

Переменная $instagram_token — это Instagram Access Token (как его получить можно узнать, прочитав статью. $instagram_id = можно узнать, например, здесь. Просто замените xxx на свои данные и вы получите список своих последних фотография из инстаграма.

Полный код:

<html lang="ru-RU" prefix="og: http://ogp.me/ns#" class="no-js">
<head>
</head>
<body>
<?php
    // Get our data
    function fetchData( $url ){
        $ch = curl_init();
        curl_setopt( $ch, CURLOPT_URL, $url );
        curl_setopt( $ch, CURLOPT_RETURNTRANSFER, 1 );
        curl_setopt( $ch, CURLOPT_TIMEOUT, 20 );
        $result = curl_exec( $ch );
        curl_close( $ch );
        return $result;
    }
    function instagram_feed( $instagram_token, $instagram_id ) {
        if ( $instagram_token != '' && $instagram_id != '' ){
            // Pull and parse data.
            $result = fetchData( "https://api.instagram.com/v1/users/{$instagram_id}/media/recent/?access_token={$instagram_token}" );
            $result = json_decode( $result );
            $limit = 10; // Amount of images to show
            $i = 0;
 
            foreach ( $result->data as $post ){
                if ( $i < $limit ){
                    echo '<a class="insta-wrap__link" rel="nofollow noopener noreferrer" target="_blank" href="' . $post->link . '">';
                    echo '<img class="insta-wrap__image" src="' . $post->images->thumbnail->url . '" alt="">';
                    echo '</a>';
                    $i ++;
                }
            }
        }
    }
?>
 
<div class="instagram-feeds">
    <?php
        $instagram_token = 'xxx';
        $instagram_id = 'xxx';
        if ( $instagram_token !='' && $instagram_id != '' ) { ?>
            <div class="insta-wrap">
                <?php instagram_feed( $instagram_token, $instagram_id ); ?>
            </div>
        <?php }
    ?>
</div>
 
</body>
</html>

Демо

Вы используете блокировщик рекламы

Пожалуйста, отключите блокировщик рекламы

Подробнее

Подписывайтесь на наш Telegram канал, чтобы не пропускать наши статьи 😎

Комментарии (8)

Иванй 13 ноября, 2017, 08:52
Все бы хорошо, да вот только, из-за вывода скорость загрузки страницы падает сильно. Может есть какой-то вариант с выводом фото, после того как страница прогрузилась. Так как у меня фото из инсты выводятся в футере, то мне было бы актуально.
Ответить
- Anton Andriyan 13 ноября, 2017, 10:47
  Вам нужно использовать AJAX загрузку, повесив ее на событие $(window).load(function(){});
  Постараемся в ближайшее время написать инструкцию, как это сделать
  Ответить
  - Иван 13 ноября, 2017, 14:46
    Жду очень сильно, спасибо!
    Ответить
    - Anton Andriyan 13 ноября, 2017, 20:42
      Написали о том, как вывести фото из instagram через ajax — статья по ссылке
      Ответить
Иван 13 ноября, 2017, 16:11
очень кстати симпатично реализован у вас здесь на странице вывод внизу фото из инстаграм, не поделитесь ?=)
Ответить
- Anton Andriyan 13 ноября, 2017, 17:18
  Вы имеете в виду стилизацию блока?
  Ответить
  - Иван 13 ноября, 2017, 20:23
    ну то, что когда наводишь они увеличиваются,
    Ответить
    - Anton Andriyan 13 ноября, 2017, 20:57
      Для вашего сайта добавьте такие стили:
      .insta-wrap { overflow: hidden; text-align: center; } a.insta-wrap__link { display: inline-block; overflow: hidden; } img.insta-wrap__image { transition: all 0.3s ease; } a.insta-wrap__link img { transform: scale(1.1); }
      Ответить

Добавить комментарий