Drupal 7 Display Suite

Display Suite 模块中文名是显示套件. 可以控制页面布局和自定义显示模式并且可以将显示模式作为Views的显示显示格式。

功能

  1. 添加一个自定义字段(自定义代码,PHP代码, Block)
  2. 在theme中添加自定义布局
  3. 更改标签添加样式或覆盖字段设置
  4. 集成到Views和Panels(在Views中使用显示模式而且可以重复利用)
  5. 集成最佳性能模块Entity cache 和 Object cache
  6. 自定义显示模式

安装与配置

Display Suite 模块有以下子模块。默认我们只需要启用ds和ds_ui

  1. ds
  2. ds_forms
  3. ds_ui
  4. ds_extras
  5. ds_search
  6. ds_devel
  7. ds_format

模块案例

基本使用

在没有安装DS之前我先创建一个内容类型为Products 并且添加了一些字段(图片,型号和描述)

然后添加一个内容后的显示结果. 可以说是非常简洁

接下下我们使用DS将此内容的结构调整成以下的样式

 

1. 安装并且启用DS模块后再进入到node说页面。这时会看到多出一个Manager display的选项点击以后就可以进入配置显示管理

这时我们可以选择layout和自定义显示的模式

2. 然后选择上下结构的layout结构后

保存以后就出现有左右提供调整。我们根据自己的设置来调整一下页面的结构

3. 调整页面成左右上下结构,只需要将字段拖动到制动的区域既可

 

4. 现在当我们再刷新Node页面时。就会有上下左右结构的内容了

产品列表页面

现在再来创建一个最常见的产品列表页面。左边图片右边为描述

1. 我们先去添加一个产品列表的显示模式(admin/structure/ds/view_modes) 进去创建页面后默认是空的。我们需要去创建一个

保存以后我们再进入到Product的管理显示页面, 启用 

点击进入到product list显示模式。并且选择左右结构的layout

最后将图片放右边内容放右边并且只显示一部分内容

然后创建一个products的views, 将显示模式修改在product list

最后VIews 页面的显示结果, 右边的图片是我用Devel generate 生成。这边为了更好的显示效果我的图片是200x100, 调整了一下CSS

 

添加More链接

为产品列表添加更多的链接,可以直接点击进入到产品详细页面. 首先需要启用ds 扩展模块(Display Suite Extras). 然后再进入到product list的显示模式就会多出一个Read more的字段. 我们将此字段拖动到页面右边

现在再刷新Product Views页面.是的我只写了一点点CSS.

其它功能

添加block或者PHP 代码为一个字段加入到显示中去, 添加block是非常方便的。因为经常我们内容中需要嵌入一个block

现在再进入到管理显示页面

或者直接进入到ds字段管理(admin/structure/ds/fields)

 

模块下载

下载中....