您现在的位置是:首页 > cms教程 > DedeCMS教程DedeCMS教程
dedecms5.7下拉导航菜单教程
危眺沃2023-12-26DedeCMS教程已有人查阅
导读最近用了织梦CMS的较新版5.7做了个网站,发现系统默认的导航条不是很好看,也没有下拦菜单,感觉比较单调难看,如何美化下拉菜单?经本人调试成功
最近用了织梦CMS的较新版5.7做了个网站,发现系统默认的导航条不是很好看,也没有下拦菜单,感觉比较单调难看,如何美化下拉菜单?经本人调试成功,觉得效果不错,现在做个教程与大家分享。
美化导航条步骤:
1.将下面这段代码贴到templets\default\footer.htm文件里(我是放在footer文件的最下面)
把mmenubg.gif 放在/templets/default/images 里面,再刷新下看效果。(注:mmenubg.gif里的文字自己修改。)
3.此时你发现菜单与栏目不够适应,别急,可以调节css来达到相应的菜单宽度。
打开/templets/default/style/织梦模板.css文件(用记事本打开) 找到.dropMenu 这个就是控制导航条的。
看下面的代码:
4.把green_skin.png(已经蓝色化)、header_hover.png放在/templets/default/images文件夹里。
美化导航条步骤:
1.将下面这段代码贴到templets\default\footer.htm文件里(我是放在footer文件的最下面)
<!-- //二级子类
下拉菜单,考虑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>
2.刷新网页发现已经神奇地出现了下拉菜单,但此时是透明的,因为缺少一个下拉菜单图片。把mmenubg.gif 放在/templets/default/images 里面,再刷新下看效果。(注:mmenubg.gif里的文字自己修改。)
3.此时你发现菜单与栏目不够适应,别急,可以调节css来达到相应的菜单宽度。
打开/templets/default/style/织梦模板.css文件(用记事本打开) 找到.dropMenu 这个就是控制导航条的。
看下面的代码:
/*-------- 下拉菜单 --------------*/
.dropMenu {
position:absolute;
top: 0;
z-index:100;
width: 120px;
visibility: hidden;
红色代码就是控制下拉菜单的宽度,调整到自己满意的宽度。4.把green_skin.png(已经蓝色化)、header_hover.png放在/templets/default/images文件夹里。
本文标签:
很赞哦! ()
下一篇:给dede织梦评论加上楼层号
相关教程
图文教程
删除dedecms官方书签的方法
今天在修改模板时发现织梦模板 默认模板的个人空间左下角“个人书签”区,有一个默认的DEDE官方书签。于是想删除掉,经过研究,发现还是比较简单的。
多种方法实现dedecms专题随意调用代码实例
关于DedeCMS专题页面的文章的调用,下面给出三种调用方式,可以解决全部页面的调用(首页、一级、二级、单页、内容页均有适合的)
织梦dedecms调用自定义字段的代码示例
{dede:arclist addfields=add1,add2,需要查询出来的自定义字段名 channelid=自定义内容模型的ID row=10 o
织梦dedecms自定义表单数据校验不对的解决方法
织梦DedeCMS的自定义表单是个非常强大的功能,我们可以用来开发在线留言、在线报名等等表单,满足建站对表单的各种需求。不过我们在使用织梦DedeCMS自
相关源码
-
(PC+WAP)红色驾校培训学车在线预约源码下载基于PbootCMS内核开发的驾校培训专用网站模板,深度适配驾驶培训行业展示需求。采用PC与移动端同步响应设计,单一后台统一管理内容数据,更换图文素材后可快速转变为其他行业网站。查看源码 -
(PC+WAP)绿色硅胶橡胶玩具制品营销型网站源码下载为硅胶橡胶制品及玩具行业打造的营销型网站模板,采用PbootCMS内核开发,通过模块化设计实现产品参数、安全认证、应用场景等专业内容的可视化呈现,助力企业建立可信赖的线上展示平台。查看源码 -
(自适应)互联网建站网络公司个人工作室网站模板基于PbootCMS内核开发,围绕「技术方案展示」「成功案例库」「服务流程说明」三大模块构建,支持PC与移动端数据实时同步。附带包含客户评价、行业解决方案的完整测试数据包查看源码 -
自适应黑色建筑装饰设计公司个人工作室pbootcms模板基于PbootCMS内核开发的黑金风格模板,为建筑装饰、工程设计类企业打造,采用开源架构,支持跨行业快速适配,核心优势如下: 查看源码 -
(自适应)包装机贴标机设备网站源码免费下载基于PbootCMS内核开发的响应式企业模板,为包装机械、贴标设备等工业领域打造,通过数字化展示提升企业专业形象。查看源码 -
pbootcms模板(自适应)花店鲜花花卉园艺网站源码一款基于PbootCMS内核开发的花店鲜花配送与花卉园艺企业网站模板。该模板采用响应式设计,自动适配手机、平板等移动设备,确保用户在任何设备上都能获得优质浏览体验。查看源码
| 分享笔记 (共有 篇笔记) |
