SpectragramJS

SpectragramJS представляет собой лёгкий jQuery плагин для отображения популярных или тематических фотографий с Instagram с помощью API этого сервиса.

Скачать (.js, 3 Кб)

Особенности

Можно получать самые релевантные, популярные и самые «свежие» изображения из Instagram
Можно отображать результаты с помощью любых списков с использованием любых тэгов, которые вы определите
Можно определять размеры изображений (маленькие, средние, большие)
Вы будете использовать ваш собственный ClientID и AccessToken
Скоро будут добавлены новые фишки!

Как начать работать

Для того, чтобы начать работать с приложением, вам необходимо зарегистрироваться на Instagram Developers, чтобы получить client_id и access_token.

Простое использование

Вам нужно проверить, что jQuery скрипт уже включен в ваш проект, затем вы прописываете скрипт spectragram.js перед тэгом </body>.

1
2

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/spectragram.js"></script>
Указываете ваши Instagram accessToken, clientID в запросе:

1
2
3
4

jQuery.fn.spectragram.accessData = {
accessToken: '[your-instagram-access-token]',
clientID: '[your-instagram-application-clientID]'
};
Вызываете функцию spectagram на контейнере, где будут отображаться фотографии, и запускаете запрос:

1
2
3

$('ul').spectragram('getRecentTagged',{
query: 'converse'
});

Этот пример покажет вам 10 или менее фотографий с тэгом “converse”, с размером “medium”.

Конфигурация

.spectragram( Method, [Options] )

Method (Метод): getUserFeed, getPopular или getRecentTagged

Options (Опции): Массив опций для настройки опций плагина spectragram

Методы

getUserFeed
Получить самые последние фотографии определенного пользователя.

$('ul').spectragram('getUserFeed',{

query: 'adrianengine'

});

getPopular
Получить список самых популярных фотографий на текущий момент времени.

1	$('ul').spectragram('getPopular');

getRecentTagged
Получить список недавно отмеченных фотографий.

$('ul').spectragram('getRecentTagged',{

query: 'converse'

});

Опции

accessToken (required)
Тип: Строка
Это Instagram Application AccessToken. По умолчанию: Null

clientID (required)
Тип: Строка
Это ваш Instagram Application Client ID. По умолчанию: Null

query (required)
Тип: Строка
Это строка поиска. По умолчанию: ‘coffee’

max
Тип: Число
Максимальное число отображаемых фотографий. По умолчанию: 10

size
Тип: Строка
Размер фотографий. ‘small’, ‘medium’ или ‘big’. По умолчанию: ‘medium’

wrapEachWith
Тип: Строка
HTML тэг, которым будет оборачиваться каждая фотография. По умолчанию: ‘<li></li>’

Пример

jQuery.fn.spectragram.accessData = {

accessToken: '[your-instagram-access-token]',

clientID: '[your-instagram-application-clientID]'

};

$('div').spectragram({

query: 'converse',

max: 14,

size: 'big',

wrapEachWith: '<p></p>'

});