在这一节中我们将进一步的完成博客页面，为其添加一些辅助的模块，使得其和目标网站更加的相近
1，本节目标
了解菜单与模块的关系，学会如何给页面的指定位置分配模块
2，对比目标网站
在完成了菜单项类型后，再来对比一下我们网站目前的博客栏目和目标网站的博客页面的区别
我们的网站博客栏目的截图：
目标网站博客栏目的截图：
通过上图的对比，我们能够发现，目前我们的网站已经和目标网站在布局上非常的接近了，只不过还少了一些小的部分。如图：
3，为页面分配模块
在前面的章节中我们知道 Joomla的页面是由很多的模块位置和一个组件输出组成的。如果你不明白，可以参考文章： 深入理解模板与页面 。通过对菜单项的设置，我们已经在组件输出中输出了文章列表。剩下的部分那就是模块了。
完成次级导航模块（上面的红框中出现的部分）
上面的这个博客部分实际上是由菜单模块产生的，它主要显示当前菜单和他的下级菜单。要实现这个功能，系统自带的菜单模块就可以完成。我们只需要在这个地方放置一个菜单模块即可。虽然在前面我们已经学习了如何将菜单模块发布到前台，在这里我们再来总结一下：
1，确定该模块的位置。 通过预览模块的位置，我们知道需要将模块放置的位置是 submenu 这个位置。
不清楚如何预览模块位置的，请参考文章：Joomla模板位置预览
2，在模块管理中新建一个模块 。在内容管理 -> 前台模块管理中进入模块列表，点击新建。如图：
3，在新建模块界面，将模块的类型选择为 菜单。如图：
4，设置菜单模块的参数。具体的设置截图如下：
关于菜单模块的设置说明
- 图标1：为了便于我们以后的管理维护，我们给该模块取了一个名字，叫做“子菜单”
- 图标2：将选择菜单选择为主菜单。因为我们想显示主菜单的二级菜单。
- 图标3：将基准条目设置为“当前”，这个非常的重要。
- 图标4：将开始层级设置为“2”
- 图标5：将结束层级设置为 全部
- 图标6：将显示子菜单项设置为是
- 图标7：将显示标题设置为否。我们不需要显示标题
- 图标8：将模块位置设置为submenu. 这个非常重要
- 图标9：将状态设置为发布，否则不会出现在前台的
为了让模块显示出来，我们还需要 在菜单指派选项卡中将模块指派 设置为 在“全部的页面上”，如图：
4，多重布局的选择
在Joomla中经常会用到的一个技巧就是多个布局（显示样式）的支持，joomla的模块是支持MVC结构的，也就是视图是独立的，一个模块可以有多个布局，借助于这个特性，经常我们在不改变模型数据输出的情况下，可以创建多个布局来实现不同的展示样式。就拿菜单模块来说，系统默认支持两种，一种是水平的一种是垂直的。
在本例中，由于模板框架的原因，系统默认将新建的菜单模块显示样式设置为“可折叠的默认菜单”，这并会导致我们的二级菜单不居中对齐，为了解决这个问题，我们需要手动将选择样式设置为默认.如图：
做完了这些，保存后，在前台刷新一下，看看效果。截图如下：
已经按照我们的预期，出现了二级菜单，但是还有一些不完美的地方，就是没有出现和案例网站一样蓝色底的标题。我们还需要进一步的解决。
5，模板框架
之前提到过这个版本的ZFree模板将基于模板框架来实现，由于模板框架自带了设置页面标题的功能，因此，我在开发Zfree模板菜单模块的时候就没有将标题功能也放入。下面简单的介绍一下，如何展示出标题。
页面标题是一个十分常用的功能，当前的模板框架将这个功能集成在菜单的设置界面了，用户可以给每一个菜单设置单独的页面标题。在菜单项的编辑界面，可以看到有一个页面标题的选项卡。我们可以在里面设置标题。如图：
最终的效果如图：
评论 (0)