【WordPress】利用HelloFlash插件实现图片轮播/幻灯片效果

最近忙的焦头烂额,除了完成自己份内的事外还接了个做站的任务。项目组的人想建个网站向外界展示项目的进度,估计是不舍得花钱找公司,于是让小Z同学搭建一个类似内容管理系统的网站。可小Z不希望在底层开发上浪费时间,于是我俩搭伙准备用WordPress来实现这个展示网站。

既然是展示网站,在首页加个幻灯片播放图片效果是很有必要的。于是我找到了HelloFlash这款插件。HelloFlash其实主要还是利用jquery动态调用图片的方式实现的,比单纯的flash播放器体积小多了。自定义显示的图片这项功能是非常实用的,并且后台可以自定义导航区的大小,现在就来说一下具体怎么使用。

插件的下载->安装就不细说了,激活插件后要手动将<?php flash(); ?>这句代码添加到你想要的位置,我这里是首页的文章标题前方,也就是<?php get_header(); ?>下边,最好单独放进一个层里,便于自定义样式,层的高度和宽度一定要大于等于该插件后台设置的播放区的大小,否则图片就会显示不完整。

后台设置最好选中“自定义模式”,如下图所示,

自定义模式

这样加载图片会很方便。在该模式下,当你发表日志时找到下方的“自定义字段”区域,名称一栏输入“flash_image”,字段值填写图片的地址,然后“添加自定义字段”。如下图:

添加字段

这样你的首页图片导航中就会滚动播放该图片,链接指向你刚刚发布的这篇日志。效果图如下:

调用

插件的使用基本上就这样了,非常的简单易用,而且加载速度比flash方式要快一些。

还有个小问题要注意,如果该导航加载的位置(即<?php flash(); ?>的位置)在菜单栏的下方、并且你开启了二级菜单显示时,图片常常会将弹出的二级菜单覆盖住,我是这样解决的,打开主题css文件,找到菜单层对应的id或class,添加z-index属性,将属性值设置的大一些(比如100)就可以了。

HelloFlash插件下载地址:helloflash