在 Drupal 7 中创建幻灯片（slideshow）和 jQuery 轮播（carousel）。第 1 部分
在网站开发中，我们经常希望为页面增添一些亮点，使网站更加生动。用 Drupal 创建的网站在初始安装后通常显得比较静态、普通，而我们希望它看起来更有个性、更具动感、更鲜明、更“活”。为此，我们可以添加下拉菜单、动态更新的页面，或者在网站头部放置一个轮播横幅（banner）。
掌握 CSS 是非常有帮助的，因为借助它我们可以使网站具有独特的风格，改变配色方案。当然，即使使用默认模板，我们仍然可以让网站变得更吸引人——虽然未必完美，但也是一个不错的开始。让我们从制作横幅开始。
以前，大多数横幅都是通过 .gif 图像实现的，这类图片可以包含多个帧；或者使用 Flash 横幅。制作 GIF 动画较为繁琐，而 Flash 虽然效果更好，但也有明显缺点，比如对系统资源的高消耗。
也可以使用 JavaScript 编写横幅效果，但那需要更多的时间和对语言的掌握。自从出现了 JavaScript 框架 jQuery，这一切变得简单许多——现在可以快速、高效地创建动画效果，而且无需深入掌握 JavaScript。
下面是我们将要继续改进的网站：
首先，我们需要在主题中创建一个新的区域（region），用于放置横幅区块（block）。
打开主题的 .info 文件，在已有区域定义之后添加新的区域：
regions[content] = Content regions[right] = Right sidebar regions[left] = Left sidebar regions[footer] = Footer
添加我们自己的区域：
regions[topbanner] = Top banner
接下来，我们要决定想要哪种类型的横幅。如果只是简单的图片切换，可以使用模块 Views_slideshow 来实现幻灯片。请安装此模块及其子模块 Views Slideshow: SingleFrame 和 Views Slideshow: ThumbnailHover。这些模块依赖于 Views 模块（通常已安装）。
Views Slideshow: SingleFrame — 在单个区块中实现幻灯片播放。
Views Slideshow: ThumbnailHover — 实现带有缩略图菜单或幻灯片标题的幻灯片效果。
创建一个新的 View，在字段 Tags 中填写 slideshow：
接着添加要显示的 字段（fields）。例如，我添加了员工的姓名、职位和照片。您也可以添加节点标题（title）和正文（body）。
在 过滤器（Filters） 中添加条件：内容已发布（Published = Yes），内容类型（Content Type）= 员工（或 Page、Story、或其他自定义类型）。
在 排序条件（Sort criteria） 中，可以选择 “Node: Post date = Descending”。
然后，添加一个显示方式（Display）为区块（Block）。
在 Basic settings 中，选择样式（Style）为 Slideshow。设置后会弹出效果配置窗口。如果未出现，请点击 “齿轮” 图标进行设置。
以下是 Slideshow mode: SingleFrame 的主要配置选项：
- Timer delay：幻灯片切换的时间间隔（毫秒）
- Initial slide delay offset：首次切换前的延迟时间
- Speed：幻灯片切换速度
- Controls：启用“上一张 / 下一张”文字按钮
- Pager：启用数字分页器
- Image Counter：显示当前幻灯片序号
- Items per slide：每次显示的幻灯片数量
- Effect：幻灯片切换效果（如淡入淡出等）
这些是主要参数，其他选项也可以根据需要启用。
对于 Slideshow mode: ThumbnailHover：
- Main frame fields：在主幻灯片中显示的字段
- Breakout fields：显示在幻灯片菜单（如缩略图）的字段。可以使用较小尺寸的图片预设作为缩略图，从而在幻灯片下方显示小图导航菜单。
其余设置与 SingleFrame 模式类似。
保存视图。如果您创建了 block 类型的显示，请将其放入我们先前定义的 “Top banner” 区域中。
若要自定义横幅的外观，可编辑主题的 CSS 文件（例如 style.css），调整颜色和布局，使其与网站整体风格匹配。
在本教程的下一部分中，我们将添加图片形式的按钮，创建一个无需额外模块的 jQuery 横幅，并学习如何构建 jQuery 轮播（carousel）。