织梦导航栏制作下拉菜单,织梦技术
导读:织梦技术织梦技术织梦5.7版本的默认模板中,导航栏是没有二级菜单的,其实默认模板中可以设置二级菜单。下面我们就来看看怎样实现织梦默认模板导航栏的二级菜单。dede手机模板dede后台模板。
织梦5.7版本的默认模板中,导航栏是没有二级菜单的,其实默认模板中可以设置二级菜单。下面我们就来看看怎样实现织梦默认模板导航栏的二级菜单。 1、为了演示二级菜单的样式,我们创建一个栏目“新闻中心”,其下有3个子栏目“公司新闻”、“行业咨询”、“视频中心” ,创建完成后,生成网站,导航栏没有下拉菜单的样式。下面就是二级菜单的添加方法。 2、首先在默认模板文件夹default的footer.htm文件中的头部加上这段代码<!-- //二级子类下拉菜单,考虑SEO原因放置于底部 --> <script type='text/javascript' src='{dede:global.cfg_cmsurl/}/images/js/dropdown.js'></script> {dede:channelartlist typeid='top' cacheid='channelsonlist'} <ul id="dropmenu {dede:field.typeid/}" class="dropMenu"> {dede:channel type='son' noself='yes'} <li><a href="[field:typelink/]">[field:typename/]</a></li> {/dede:channel} </ul> {/dede:channelartlist} <script type="text/javascript">cssdropdown.startchrome("navMenu")</script> 把上面代码放入footer.htm后,保存文件,生成一下网站后,网站的导航栏就已经出现二级菜单的样式,样式如下图: 现在就有了二级菜单的样式,并且没有背景,是透明的背景。 3、通过看上面添加的代码,其中调用了一个js文件,是织梦系统的/images/js/dropdown.js ,通过这个路径你会发现文件是织梦系统自带的,不是模板中的,所以我们就算用其他的模板也可以调用这个js样式。 另外我们现在也可以对这个透明的二级菜单做调整,因为二级菜单的样式在织梦默认模板default的style中的dedecms.css中也是默认存在的,打开dedecms.css查询“下拉菜单” 这个词,就可以找到代码,如下图 .dropMenu就是下拉菜单的样式,懂div+css的朋友应该知道怎样修改,不懂的请学习一下css。 4、通过上面的下拉菜单的css样式,我们可以看到,下拉菜单的背景是名称为mmenubg.Gif 的图片,我们可以把下面的图片复制到default的images文件夹下,命名为mmenubg.Gif ,这样下拉菜单就出现背景了。
声明: 本文由我的SEOUC技术文章主页发布于:2023-07-19 ,文章织梦导航栏制作下拉菜单,织梦技术主要讲述菜单,标签,织梦网站建设源码以及服务器配置搭建相关技术文章。转载请保留链接: https://www.seouc.com/article/web_31001.html