3

我正在尝试使用 Galleria (http://galleria.aino.se/) 从 Flickr 照片流(或设置)中导入/显示照片。我在 Galleria 文档中找不到任何有用的信息。该怎么做呢?

4

2 回答 2

2

最简单的方法是使用 Flickr 的 JSON 提要制作照片集。

1.获取饲料

确保通过 Flickr 的“组织”菜单将您尝试使用的集合设置为公开,然后查看该集合并在页面底部找到 RSS 链接。默认情况下,RSS 提要采用 XML 格式;要获取 JSON 版本,只需添加&format=json&jsoncallback=?到 URL 的末尾:

RSS订阅:http://api.flickr.com/services/feeds/photos_public.gne?id=xyzexample&lang=en-us

变成

http://api.flickr.com/services/feeds/photos_public.gne?id=xyzexample&lang=en-us&format=json&jsoncallback=?

2.解析JSON

此示例使用 jQuery,因此请记住在此代码之前包含 jQuery 文件。这也假设您的 Galleria div 的 id 为“gallery”:

<script type="text/javascript">
$().ready(function() {
  // JSON feed from Flickr
  var feedUrl = "http://api.flickr.com/services/feeds/photos_public.gne?id=xyzexample&lang=en-us&format=json&jsoncallback=?"

  // parse JSON using jQuery's built-in function
  $.getJSON(feedUrl, function(data) {

        // iterate through each item
        $.each(data.items, function(i, item) {
            // create image node in DOM and update it's src attribute
            // _m = medium img, _b = large; remove the replace function if you want the standard small images
            $("<img/>").attr("src", item.media.m.replace("_m", "_b"))
                // add image to gallery container
                .appendTo("#gallery")
                // add a link to each image - this will go to the photo on Flickr
                .wrap('<a href="' + item.link + '" target="_blank"></a>');
        });
});
</script>

3.添加Galleria

在 'gallery' div 上启动 Galleria 插件:

$("#gallery").galleria();

(显然,您需要根据他们的文档包含 Galleria 插件和主题)

于 2011-05-09T12:55:40.630 回答
0

1.2.4 版的 Galleria 下载中包含一个 Flickr 插件,它使这些事情变得非常简单。这是插件的文档,包括示例: http: //galleria.aino.se/docs/1.2/plugins/flickr/

于 2011-07-02T07:02:40.920 回答