PageCookery:为照片墙增加灯箱和透明效果

[music1g play=#315715]

不是很喜欢PageCookery默认的照片墙效果,很早之前用了@ideeland同学的方法换了一个透明效果,感觉还不错。这两天又想着搞一个LightBox(灯箱)效果,即点击小图片后可以用LightBox效果浏览大图片。预览效果请见:传送门

PageCookery里头Flickr照片墙是通过CURL函数获取最近上传的json数据来实现的,比较可以的是获取过来的json数据只有小图地址而没有大图地址。所以我就打算自己用Flickr API写过一个。经试验发现,这里需要使用flickr.people.getPublicPhotos和flickr.photos.getSizes两个API,前者获取最近上传照片的信息,后者则获取特定照片的全部尺寸地址。

将下列代码保存成photos.html替换掉template/photos.html


{template header}
<style type="text/css">
    @import 'css/jquery.lightbox.css';
    ul.photos li {
    overflow:hidden;
    /*根据这个宽度和长度控制你单行显示图片的数量,如果总长是600px,这里设置为100px的话那么你单行就能放6张图片,可以根据自己的情况做改变。*/
    /*实在计算不来的可以慢慢试出最佳值*/
    width:149px;
    height:149px;   
    }
    ul.photos li a {
  filter:alpha(opacity=70);
  opacity:0.7;
  -moz-opacity:0.7;
  -webkit-opacity:0.7;  
  }
  ul.photos li a:hover {
  filter:alpha(opacity=100);
  opacity:1;
  -moz-opacity:1;
  -webkit-opacity:1;
  }
</style>


    $key= ""; //输入你申请的key,请到"http://www.flickr.com/services/apps/create/noncommercial/?"这里申请你自己的非商用key $user_id = ""; //输入你的账户id,请到"http://www.flickr.com/services/api/explore/?method=flickr.photos.getRecent"这里查看你的id $per_page = ""; //输入你要显示的照片的数量 $data = file_get_contents("http://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key=" . $key . "&user_id=" . $user_id . "&per_page=" . $per_page ); $object = simpleXML_load_string($data); $photo = $object -> photos -> photo; foreach ($photo as $each) { $photo_m = 'http://farm' . $each['farm'] . '.static.flickr.com/' . $each['server'] . '/' . $each['id'] . '_' . $each['secret'] . '_m.jpg'; $photo_b = 'http://farm' . $each['farm'] . '.static.flickr.com/' . $each['server'] . '/' . $each['id'] . '_' . $each['secret'] . '_b.jpg';
  • }
{template footer}

需要填写的东西我已经在代码里写好了,大家填写上就好了。可能美观上有些问题,大家再自己根据我这个修改一下自己的样式表就可以了。如有不懂的地方也可以留言,我会尽量帮忙的啦~
其实我自己的上面是把php语句function成了一个函数,然后再html模板中直接引用就好啦~嘿嘿,发现我最近真的很喜欢这样做,function_microblog.php里已经有好几个自定义函数了。嘿咻~!然后顺便想说的是更换了一个新的icon,没别的意思,就像让大家看一下,结束!

PS:搞完这个之后,我发现Flickr有最近更新的RSS订阅,XML里小图地址大图地址各种齐全,连API,USER_id什么的都不要,各种给力。于是我就这么的悲催了image

夏日大作战

总有那么一个故事,剧情老套,主题乏味,但是总是能够卷起我们的泪水,让我们拍案叫好。我想说,夏日大作战,正是那么一部电影。人与人之间的团结永远是永恒的话题,“兄弟齐心,其利断金”这亘古不变的真理也在电影中表现的活灵活现。整部片子带有诙谐色彩,看完之后你会发现,原来世界还可以这样拯救。

在豆瓣上看到CMGS君用Geek的态度审视着这部影片,那么我也来截个屏,说说我的观点:

image

恩,这个不需要我多说,华丽丽的Windows 7,下面还摆了一堆常用系统图标。只是我比较奇怪桌面右边的类似任务栏的是什么,OZ系统专有的么?貌似开OZ就会有那个东西。

image

噗,松下的电视,这屏是为我妈以前买的4000块的松下手机截的。

image

Windows 7?不,我要打架看的是那银闪闪的Dell商标!话说这部片子最多的就是Dell和Windows 7了...

image

看不清楚上面的文字,求科普这是哪个牌子的手机。话说,男生用这种样式的手机我感觉很不习惯呢...呵呵...

image

佳主马的手提,赤裸裸的戴尔额,话说这款高中的时候还觉得挺帅的呢!就是买不起...= =|||

image

恩,好吧,我错了,开OZ也不一定会有那个右任务栏出现...

image

惊现右任务栏,求科普是神马东西!

image

小孩子的表情真搞笑,哈哈哈!看的好笑所以截屏下来了。这三个小孩子真是捣蛋的说,然后再话说,三台NDSL啊!

image

噗,OZ的虚拟人物果然死也有工作的呢……不过乃们不感觉那个是一个小屏化得Windows 7么?

image

再次惊现小屏化得Windows 7,然道说OZ后台管理的界面是仿Windows 7的?这没版权问题吧...汗...

image

话说这位仁兄的OZ就不是Windows 7了诶,其实我是想让大家看看右上角的啦,Microsoft Windows 7...笑而不语...

image

不得不感慨一下OZ系统的跨平台性能,连NDSL也可以啊...手机上也是华丽丽的呢!

image

比较悬念的出来呢~任务栏跟前面的Windows 7不同了,所以应该不是Windows 7,任务栏那个Microsoft Windows 7想必大家已经看的非常清楚了。任务栏快速启动那里摆放着Microsoft和IE的图标不知道大家看清楚了没有。CMGS大神和其他仁兄都讲这个是Linux,我怎么看怎么觉得这个是Windows XP呢?!额...愚见...

image

三任务栏出现!好吧..我觉得这系统越来越恶搞了...话说这回Microsoft和IE的图标应该很清楚了吧,旁边那五个颜色不一样的东西还真不知道是什么...估计一个公司出的。

image

来个更清楚一点的,话说大家不知道有没有发现,底部任务栏开的那个文件夹的名称,怎么那么像"Tecent File"啊!!!!吓到我了

image

从这里也可以看出,这位大叔的电脑系统就是所谓的Linux本人疑似Windows XP的那个系统呢...而且,貌似也还开着那个"Tecent File"文件夹!

恩,截屏描述完毕。总的来说,这是一部搞笑煽情片,值得大家一看。(纳尼?!乃们早都看过了啊?!好吧,我凹凸了...)最后值得一提的是,影片里的音乐也是非常的成功呢,比如文章首的奶奶鼓励大家的背景音乐听的就非常的热血沸腾。

引用豆瓣最近读过的书和看过的电影

前几天在捣鼓我的PageCookery主题的时候想引用豆瓣上我最近看过的电影和书,当时只是手工自己写上去的而已。我度过的书到还是好说,一年也难得有一本,但是电影就多了,手写也不是办法。于是开始研究起豆瓣的API了。发现豆瓣输出的是Atom和Json的结果,恩,我用的是Atom的,想要Json版的请看传送门

效果预览请见传送门,详细代码如下:

function Douban($username, $subject, $apikey)
{   
if ($apikey == "")
{
  $apikey='064e10081295144112ea301837bf3cc3';
}
$douban='http://api.douban.com/people/' . $username . '/collection?cat=' . $subject . '&apikey=' . $apikey ;
$feed =  simplexml_load_file($douban);
$children =  $feed->children('http://www.w3.org/2005/Atom');
$a = $children-> entry->children('http://www.w3.org/2005/Atom')->xpath('//db:subject');
echo '
    '; foreach ($a as $d) echo '
  • ' . $d -> title . '
  • '; echo '
'; }

我把它定义成了一个函数Douban,WP就放到主题的function.php下,PageCookery就放到/lib/function_microblog.php里,其它的自己看着办咯。引用的时候只要如下形式即可

< ?php Douban('lizheming', 'movie' , '');//形式是昵称|收藏类型|API_KEY ?>

收藏类型有movie|book|music三种类型可以选择,API_KEY我设置了如果为空则默认一个,但是我还是希望大家可以自己去申请一个,因为豆瓣的api有引用频率的限制,如果一个api_key很多人同时用,可能会出问题。如果使用上有什么问题,大家可以留言。

参考资料:PHP中的SimpleXML处理//对SimpleXML的描述很详细,推荐!