Featured Content Gallery 幻灯片介绍

不知道从什么时候开始,幻灯片展示成为国内大大小小的网站最追捧的功能。相信最合理的解释就是一个字“炫”!同时很多热心的开发人员都免费提供了很多幻灯 片给大家来使用,今天呢!西林我给自己的网站按上了幻灯片,我选择的是网友帕兰映像推荐的 Featured Content Gallery 幻灯片。

在他的网站看介绍的时候我一开始可被帕兰同学吓了一大跳。他介绍这个插件的原文是这样的:

2. Featured Content Gallery

可以指定一个分类或指定特定的文章ID来输出推荐内容。样式更丰富一些,但设置也比较复杂一些。需要指定的自定义字段比较多。幻灯片脚本使用jondesign的Smooth Gallery。

呵呵!有挑战才有干劲,你越说难我越要用。(其实其他介绍的其他4个幻灯片我都试过了,我对他们的评分不高。当然日后我也会对其进行一些介绍!)

其实我发现这个幻灯片有一个很大的亮点,在很多幻灯片里作者都要求大家把文章放在一个特定的分类中,然后幻灯片只能按顺序进行展示,如:

该分类存在A、B、C、D四篇文章,按顺序D是最新的文章,幻灯片展示数量为4。如果你添加一个新的文章E的时候,A文章就不会在幻灯片里展示了,而 Featured Content Gallery则可以很好的解决问题,你可以设置幻灯片按文章ID来展示,也就是说,你不需要考虑展示的文章在哪个分类,只需要知道这篇文章的ID,然后 在后台添加文章ID,告诉幻灯片你需要展示这个,你可以随意选择A、B、C、D、E文章的任意组合!

好!进入正题,首先先下载和安装 Featured Content Gallery 插件!如图:001 (废话!)

图001

图001

然后我们可以在“设置”区域找到 Featured Content Gallery 的配置选项。进入!图002(再废话板砖伺候!)

图002

图002

其实认真看一下,这些配置项还是很简单的,我们只需要一次配置完了以后,后面在写文章的时候只需要配置一些添加的字段就可以了。(好多E文啊!)

西林我现在对配置开始逐一的介绍:

第一步骤:Featured Content Gallery Code

你需要将该插件的展示代码放入到你的模板中。代码如下:

<?php
  include(ABSPATH.'/wp-content/plugins/featured-content-gallery/gallery.php');
?>

第二步骤:Featured Content Selection

选择你需要展示的方法,可以指定一个分类(category)也可以指定一个或多个文章的ID号(这里推荐大家指定文章ID最好在2个或2个以上)(图003)

003

003

其实“Check here to randomize post/page ID display”意思是不按之前我们填写的文章ID号顺序展示,而是随机对推荐文章进行展示。

第三步骤:Gallery Style – Choose your gallery size and colors

这里进行界面样式的参数配置。(图004)

004

004

这里没有太多需要做说明的地方!

第四步骤:Slide Transition Times and Other Options – Choose your slide and fade duration, carousel button name and text overlay word quantity

配置小图和说明文字信息(图005)

005

005

Slide Display Duration 切换的时间,默认时间是:9000毫秒 相当于 9 秒

Slide Fade Duration 渐隐时间,默认:500毫秒 相当于 5秒

Carousel Button Name 查看推荐文章的缩略图按钮 文字

Number of Words in Text Overlay 描述文字的限制数量,默认为 100 (这里主要是针对英文,中文的话,大家自己测着改,不改也可以)

第五步骤:Slide Transition Type – Choose your slide transition effect:

006

006

选择展示效果,分别为:

1、Simple Fade 简单渐变,很普通,普通到不能再普通了。显示器来比较硬。不过兼容性好!

2、Slide Left with Fade 向左带过度渐变的效果,很柔和!

3、Continuous Horizontal 从左到右移动切换。

4、Continuous Vertical 从上到下切换

大家可以根据自己的喜好来选择显示效果!

配置到这里已经基本结束了,剩下的就是需要在说明一下如何给需要推荐的文章添加一些格外的设置,我们在需要推荐的文章中添加新字段,如下图:

007

007

以下是需要添加的字段名和值的说明:

articleimg 这个是幻灯片展示时候那个大图。这个字段是必须要添加的不然在幻灯片里我们只能看到一个背景,或者一个在永不停止的LOADING条

featuredtext 描述信息,就是在幻灯片正下方显示出来的一些文字信息。这个可以根据自己的喜好,可写也可以不填写!

thumbnailimg 推荐文章缩略图,就是会在幻灯片顶部产生一个缩略图列表。可以写也可以不写,我不知道为什么作者一定要让这个列表默认为隐藏!

alttext 缩略图alt的文字描述信息,可写可不写。

到这里也就结束了。大家有兴趣可以去作者的官方网站看看,他那里的介绍可能更详细,我主要是E文不好,所以去那有点头痛。

官方地址是:http://www.featuredcontentgallery.com/install-setup/

改天有兴趣,我来HACK一下这个插件,呵呵!:)

补充一个调整:(2010-08-26)

在留言处看到一个朋友的提问,如何把那个“推荐列表关闭掉!”。后来看了一下CODE其实要关闭这个也不难只需要CSS样式文件做一个小小的改动就可以了,不一定要去动JS和PHP的代码,一般情况下不建议去动那些核心的代码!修改步骤如下:

打开插件的样式文件 jd.gallery.css ,在文件的 46行,这个地方就是控制推荐区块的显示样式,我们只需要补充一个样式就可以了 display:none,功能是把指定的区块隐藏起来。这样以后突然又想改回来的话把新增的这个地方删掉就搞定了!代码如下:

.jdGallery div.carouselContainer{
    position: absolute;
    height: 135px;
    width: 100%;
    z-index: 10;
    margin: 0px;
    left: 0;
    top: 0;
    display:none; /*关闭推荐列表区块*/
}


发表评论?

0 条评论。

发表评论


注意 - 你可以用以下 HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

无觅相关文章插件,快速提升流量