官方系列教材 - C计划

实战Joomla模板开发教程
< 返回 6.2 当面对设计稿的时候,该如何下手 - C计划

当看到目标网站或者网站页面设计稿的时候,该如何下手?该如何将它转换为joomla模板呢?在这一节中我们就来讨论一下这个问题

1,本节目标


理解如何将页面按照joomla的模板机制进行划分

2,将页面切割成模块


在实际中,一个网站的设计稿肯定不是一张图的,大家要尽量找到这些页面的共同之处,将其提取出来,作为一个模块位置。为了方便,我们先从一个具体的页面设计稿开始。假设现在美工给的设计稿如下:

 

2.1 确认主要内容(组件输出部分)

通过直观的观察网页的布局,判断哪一部分是页面的主要内容。将这个部分作为组件的输出位置。这个页面主要是展示一个图文列表,如图:

 

2.2 分隔模块位置

将页面所有非主要内容进行分割,作为辅助的模块。

为了增加网站管理的灵活性,在分割模块位置的时候,模块位置可以尽量多,这样便于管理员的修改。按照上面的步骤,我们可以大概将页面分隔为如下

页脚部分的分隔就不截图了。大家可以自己做 。

2.3,给模块命名

为了便于管理,一般我们会按照实际的需要来给相应的模块取名。最终的效果如下: 

这样,我们就完成了整个页面的设计思路的转换。也就是说,我们已经成功的将普通的设计页面转换为Joomla模板的思考方式了

接下来要做的就是将这些设计进行代码实现

C计划

第3章:Joomla模板机制
第13章:让模板支持多语言
  • 内容提要
  • 留言讨论 (0)
  • 视频教程
当看到目标网站或者网站页面设计稿的时候,该如何下手?该如何将它转换为joomla模板呢?在这一节中我们就来讨论一下这个问题

评论 (0)

  • 最新在前
  • 最佳在前

内容待完善

该课程提供视频版,可以观看完整的视频教程

第1章 Joomla入门教程

第3章 C计划

第5章 E计划

第6章 H计划

第7章 G计划

第9章 运行环境

第11章 主从与集群

第12章 模块开发

第13章 插件开发

第14章 j2.x组件开发教程

第15章 页面定制教程

第16章 页面构造器

第17章 joomla升级

第18章 其他系统迁移

第19章 流量翻倍计划