CMS Made Simple/菜单管理器

来自站长百科
跳转至: 导航、​ 搜索

CMS Made Simple | 安装 | 内容管理 | 布局 | 用户&用户组 | 站点管理 | 我的设置 | 扩展 | FAQ

菜单管理器允许您使用模板为页面轻易创建自定义的菜单。 请尝试一下菜单管理器: 使用{menu}标签的选项 在您的CMSMS设计中实现具有自定义css的菜单 在您的模板中加入div或table,用来定位菜单。

在您的CMSMS设计中实现具有自定义css的菜单[ ]

在您的模板中加入div或table,用来定位菜单如:

您的css样式应该类似于:

 #main_menu {
 margin-left: 29%; 
 margin-right: 2%; }

添加菜单标签(输出菜单):

  <div id="main_menu">{menu}</div>

然而简单加上菜单标签,对于生成漂亮的菜单时不够的,需要为它选择一个模版. cmsms默认情况下会安装三个菜单模版.其中一个比较灵活且被css美化过的是"cssmenu.tpl",接下来,您需要为标签添加模版了, 标签就变成:

  <div id="main_menu">{menu template='cssmenu.tpl'}</div>

接下来,就需要您用css来美化cssmenu.tpl模版了. 首先创建一个名为main_menu_stylesheet的菜单样式表, 添加样式表内容


 #main_menu ul {
 list-style:none; 
 margin:0; 
 padding:0; 
 } 
 #main_menu li { 
 display: inline; 
 margin: 0 2px 0 0; 
 padding: 0; 
 text-transform:uppercase; 
 } 
 #main_menu a { 
 float: left; 
 display: block; 
 font: bold 12px Arial; 
 color: black; 
 text-decoration: none; 
 margin: 0 1px 0 0; 
 padding: 5px 10px 5px 10px; 
 background-color: white; 
}

然后保存样式表,并将样式表附加到您的模版上. 至此您的主模版就可能有两个样式表了,其中一个就是为菜单准备的.

利用css美化菜单的[ ]

利用CSS可以创造任何您喜欢的设计。可以参考一些典型的例子:


http://www.dynamicdrive.com/style/csslibrary


http://www.webshapes.org/template/category/CSS_Menus


http://webdeveloper.econsultant.com/css-menus-navigation-tabs/


关于css,有一些必须是您需要知道的:

请保证您在模板中使用的div/table的id与菜单样式表中的id是匹配的。

如果您给包围菜单的div/table的id命名为main_menu, 菜单样式表中也必须要用这个名字.

如果您想让当前页面对应的菜单链接和其他链接有不同的显示效果,请在您的菜单css中添加样式,如果当前页对应的链接的css为.menuactive那么在样式表中添加的内容为:

 #main_menu li .menuactive { /** currently selected menu item **/
  background-color: 
  padding-top: 9px; 
  padding-bottom: 5px; 
  color: white; 
 }


如果您的菜单含有父级菜单或子菜单的话,为了格式父菜单,可以使用 .menuparent样式定义.


如果您使用下拉菜单或弹出菜单的话,为了能在IE6中正常工作,您需要在模板的head标签内添加下面的代码:



如果想去掉菜单项前面的数字的话,请将名为Accessibility的样式表附加到您的主模板中。

菜单节点参数列表: 请查看"菜单标签"的相关说明

如何使用内置的菜单模板

使用横向下拉菜单

将下列内容添加到模版的head标签内

将下列代码放到模板中,您希望菜单它出现的位置

 {cms_module module='menumanager' template='cssmenu-accessible.tpl' 

将名为"Default CSSMenu Horizontal"的样式表附加到您的模版上

利用$node->hierarchy来获得菜单项对应的第一个数字[ ]

 {foreach from=$nodelist item=node} {if $node->current == true}{$node->hierarchy|truncate:1:""}{/if} {/foreach}

上面代码将获得$node->hierarchy的第一个数字,如果您的菜单层次为

1. Home 
2. Services 
2.1. First 
2.2. Second 
3. Contact 
3.1. Address 
3.2. Form 

如果当前页是Services, 或者first,或者second,那么将输出2. 如果当前页是Contact, Address或Form则会输出3.

注意:上述代码之能工作在单个数字的层次,如果您的页面超过9个顶级页面的话,她是不能够正常工作。



在官方网站上有很多用户自己提交的菜单,可供您去选择:请参见User Submitted Menu

Advanced CSS Menu Styling 
menu_with_icons 
list_children (Now working with multiple groups of child pages) 
list_children_recursive 
show_home_siblings 
Generic sub-menu 
improved_sitemap 
count_children 
menu_icon_expand 
section_expand 
show_children_of 
header_link_to_child 
header_link_to_child_red_active 
header_link_to_child_dont_show_children 
page_description 
stop_at_element 
simple_menu 
inverse_menu 
suckerfish based vertical flyout nav 
A jumping nav with a select box

参考来源[ ]

CMS Made Simple使用手册导航

针对所有用户:

安装:

环境需求 | 通过Shell安装 | 通过FTP安装 | 通过cPanel安装 | 在本地Windows系统下安装 | 升级 | 复制到一个新服务器上 | 可选设置 | 技巧与窍门 | 故障排除

内容管理:

页面创建 | 新闻创建 | 图片管理 | 文件管理 | 全局内容块与内容块

布局:

模板 | 样式表 | 菜单管理器 | 主题管理模块

用户&用户组:

用户 | 用户组 | 添加用户至用户组 | 用户组权限

站点管理:

全局设置 | 页面默认值 | 系统信息 | 系统检测 | 管理日志

我的设置:

我的账户 | 用户设置 | 快捷方式管理

扩展:

模块 | 标签 | 事件管理器 | 用户定义的标签

FAQ

针对网站设计者
模板使用 | 样式表使用
针对网站开发者:
开发者FAQ | 模块API | Smarty技巧 | 模块制作教程 | 模块制作技巧 | 用户定义的标签 | 内容区块剖析 | 运行SVN版本 | 添加菜单项的副文本 | 开发笔记 | 模块分类