Как вывести фото из Instagram у себя на сайте

Шаг 1. Регистрация приложения в Instagram

Это шаг номер один, то, что вы должны сделать прежде всего, иначе никакой из последующих кодов и виджетов у вас работать не будет (плагин будет).

Ничего сложного тут нет, для начала авторизуемся (или регистрируемся) в инстаграм и переходим по этой ссылке: http://instagram.com/developer/. В итоге мы попадаем на страницу:

После нажатия на кнопку «Register Your Application» вы попадете на страницу со всеми зарегистрированными вами приложениями:

Итак, нажали на кнопку «Регистрация новой программы» и попали на страницу с формой co следующими полями:

Application name — название приложения. Нельзя использовать производные от слов Instagram, IG, Insta или gram.

Description — описание.

Website — сайт. Неважно, какой сайт вы укажите в этом поле — вывод фотографий по тегу будет работать в любом случае, даже на локалке. Указывать URL нужно с http://.

OAuth redirect_uri — куда перенаправлять пользователя после авторизации приложения или отмены (нам это поле пока не пригодится).

Ну вот и всё, вводим капчу и нажимаем кнопку «Register», чтобы создать приложение. Обратите внимание на CLIENT ID приложения — скоро он нам понадобится.

Шаг 2. Выводим фото из Instagram по тегу

Сейчас будем выводить фото из инстаграм, отмеченные каким-либо конкретным тегом, но прежде чем начать, убедить, что вы уже зарегистрировали приложение в Шаге 1.

Теперь нам нужно скачать PHP-класс instagram.class.php и закинуть его на свой сайт.

Ниже расположен листинг с кодом для вывода фото, вы можете вставить его непосредственно туда, где собираетесь выводить фотографии, а можете создать PHP-функцию с несколькими параметрами.

/*
 * подключаем класс (подробнее выше)
 */
require_once dirname(__FILE__) . '/instagram.class.php'; 
// у меня он находится в той же директории, что и файл с этим кодом
/*
 * создаем новый объект Instagram, о том, как получить $client_id написано выше
 */
$instagram = new Instagram( $client_id );
/*
 * тег, можно указать только один
 */
$tag = 'wordpress';
/*
 * количество фотографий для вывода
 */
$limit = 4;
/*
 * размер изображений (высота и ширина одинаковые)
 */
$size = 200;
/*
 * getTagMedia позволяет получить массив, состоящий из объектов изображений, отмеченных тегом $tag
 */
$media = $instagram->getTagMedia($tag);
/*
 * функция array_slice() задает количество элементов, которые нам нужно получить из массива
 * если нам нужно вывести все фото, тогда: foreach($media->data as $data) {
 */
foreach(array_slice($media->data, 0, $limit) as $data) {
	echo '<a href="' . $data->link . '" target="_blank">';
	echo '<img src="'. $data->images->low_resolution->url . '" height="'.$size.'" width="'.$size.'"/>';
	echo '</a>';
}

На моем тестовой сайте этот код вывел 4 изображения, помеченных тегом WordPress, со ссылками. То есть по логике получаем, что $data->link — это ссылка, а $data->images->low_resolution->url — URL изображения. Давайте рассмотрим больше параметров полученного объекта $data.

В описание параметров я использовал переменные $data, $comment и $user — это сделано ради простоты и удобства, названия этих переменных могут быть какими угодно. Если вы хоть немного разбираетесь в PHP, вам не нужно это объяснять.

$data->id

ID публикации.

$data->link

Ссылка на это изображение в Instagram.

$data->images->low_resolution->url

URL копии изображения низкого разрешения (306×306).

$data->images->thumbnail->url

URL изображения-миниатюры (150×150).

$data->images->standard_resolution->url

URL копии изображения стандартного разрешения (612×612).

$data->tags

Массив, содержащий все теги данного изображения.

$data->filter

Название используемого фильтра.

$data->created_time

Дата публикации в UNIX-формате. Мы можем изменить формат даты при помощи функции gmdate():

echo gmdate("Y-m-d H:i", $data->created_time);

$data->user->username

Имя пользователя, который запостил фотографию.

$data->user->id

ID пользователя.

$data->user->full_name

Полное имя пользователя.

$data->user->profile_picture

URL аватарки пользователя.

$data->comments->count

Количество комментариев к изображению.

$data->comments->data

Массив объектов комментариев, который также можно пропустить через цикл foreach и получить информацию о каждом оставленном комменте, например:

// выводим текст каждого комментария и имя пользователя, оставившего его
foreach( $data->comments->data as $comment ) :
	echo '<p><strong>' . $comment->from->username . '</strong><br />' . $comment->text . '</p>';
endforeach;

Тогда получаем следующие параметры комментариев:

$comment->created_time: Дата публикации комментария в UNIX формате.
$comment->id: ID комментария.
$comment->text: Текст комментария.
$comment->from->username: Имя пользователя, оставившего комментарий.
$comment->from->id: ID пользователя.
$comment->from->full_name: Полное имя пользователя.
$comment->from->profile_picture: URL аватарки пользователя.

$data->likes->count

Количество «лайков».

$data->likes->data

Массив объектов пользователей, которым понравилась фотография, также можно пропустить через цикл foreach:

// в качестве примера давайте выведем имена всех пользователей, которым понравился пост
foreach( $data->likes->data as $user ) :
	echo $user->username . '<br />';
endforeach;

$user->id: ID пользователя.
$user->username: Имя пользователя.
$user->full_name: Полное имя.
$user->profile_picture: URL аватарки.