OpenCart之布局(Layout)教程

本教程由 opencart中国网站制做，若有转载请注明出处： http://www.opencartchina.com/bbs/topic1009.html

若是对opencart感兴趣，也能够加入QQ群：282797742进行讨论。

OpenCart的设计布局比较灵活，大致分为五个部分：网站头部(Header)、网站底部(Footer)、左列(Column Left)、网站右列(Column Right)、网站内容(顶部(Content Top)和(Content Bottom))，图示以下：

在网站后台所管理的各个模块，都可以自由配置于上面的Column Left(左列),Column Right(右列),Content Top(内容顶部),Content Bottom(内容底部)，每一个部分的模块的排列顺序由设置模块时填写的顺序数字来决定。
若是右列没有设置任何模块，则，中间的content内容部分自动扩展至网站右边缘，以下图所示：

若是左列没有设置任何模块，则，中间的content内容部分自动扩展至网站左边缘，以下图所示：

下面咱们为产品id为28的产品详细页面设定一个特定的布局，关于layout部分是如何工做的，请参考帖子： OpenCart布局(Layout)系统是如何工做的？
咱们要为该产品设定的特定布局以下图所示：

1. 首先添加一个特定的布局，【系统设置(System)】 -> 【规划设计(Design)】 -> 【布局(Layouts)】 ，新增以下布局：

2. 【扩展功能(Extensions)】 -> 【模块管理(Modules)】 -> 【幻灯片(Slideshow)】，设置以下：

3. 【扩展功能(Extensions)】 -> 【模块管理(Modules)】 -> 【特点产品(Featured)】，设置以下：

4. 【扩展功能(Extensions)】 -> 【模块管理(Modules)】 -> 【最新产品(Latest)】，设置以下：

5. 【扩展功能(Extensions)】 -> 【模块管理(Modules)】 -> 【横幅广告(Banner)】，设置以下：

   6. 【商品目录(Catalog)】 -> 【商品管理(Products)】 编辑产品id为28的产品，作以下设定：

 

7. 上述设置完成后，当咱们单独访问id为28的产品详细页面时，会显示以下图所示：

 

本教程结束！