Клиенту понравилось наше прошлое улучшение, и теперь он задумывается над тем, как разбавить тяжеловесный текст, размещенный на главной странице. Мы предложили ему добавить в сайдбар шесть последний изображений с сервиса Flickr, которые имеют пометку “wordpress theme”. Они помогут сбалансировать контент. К счастью для нас, это действие не вызывает никаких проблем. Опять же, для ознакомления с API документацией Flickr вы всегда можете посетить сайт: http://www.flickr.com/services/api/.
Давайте начнем с того, что создадим пустое пространство в сайдбаре под изображения:
...
jQuery('.home).append('<div class="flickr">
<h2>Latest Flickr:</h2></div>');
...
Мы воспользуемся photo stream методом для формирования URL:
... var flickrURL = 'http://api.flickr.com/services/feeds/photos_public. gne?tags=wordpress,themes&tagmode=all&format=json&jsoncallback=?'; ...
Теперь мы можем вызвать getJSON:
...
jQuery.getJSON(flickrURL, function(flickrImgs){
jQuery('.flickr li').each(function(i){
jQuery(this)
.html('<img src='https://oddstyle.ru/+flickrImgs.items[i].media.m+'
width="100" height="100" />');
});
});
...
JSON строка, полученная от Flickr, возвращает массив, названный items, который содержит все типы данных. Обратите внимание, что это несколько отличается от получения текстовой информации из твитов. Добавляя media.m к URL миниатюр, мы можем создать простой список изображений. Выглядеть он будет следующим образом:
