企业官网对品牌调性、栏目结构与转化路径都有要求,直接套用织梦默认模板往往难以满足。掌握模板改造技巧,可以在不大改内核的前提下,快速得到符合企业气质的站点。
一、改造前的模板结构梳理
1. 摸清模板文件分布
织梦模板位于templets目录,默认主题文件包括index.htm、list_article.htm、article_article.htm、head.htm、footer.htm等。改造前先确认每类页面调用的模板文件,避免改错位置。
2. 备份原模板
建议将原模板目录整体复制一份作为备份,改造过程中出现问题可随时回滚,防止线上页面空白。
二、头部与导航改造
1. LOGO与品牌色替换
替换images下的LOGO文件,并在head.htm中调整LOGO尺寸。品牌色建议定义为CSS变量,集中管理:
:root{--brand:#c1440e;--brand2:#e76f51}
.head{background:var(--brand)}
.nav li:hover{background:var(--brand2)}
2. 导航高亮处理
利用{dede:field.typeid/}判断当前栏目,为对应导航项添加active类,提升用户定位感。
<li class="[field:id runphp=yes]if(@me==<?php echo $typeid;?>)@me='active';else @me='';[/field:id]">
三、产品/案例展示模块
1. 产品栏目绑定图片模型
企业站常见产品图集,建议使用织梦图片模型或自定义模型,字段包含产品图、参数、详情。列表页用{dede:list}调用缩略图。
2. 首页产品区块调用
{dede:arclist typeid='2' row='8' type='image'}
<div class="pro">
<a href="[field:arcurl/]">
<img src="[field:litpic/]" alt="[field:title/]">
<span>[field:title/]</span>
</a>
</div>
{/dede:arclist}
缩略图建议统一裁剪比例,前台用object-fit:cover保证不变形。
四、单页栏目改造
关于我们、联系方式等单页栏目,使用织梦单页文档即可。模板文件list_article_single.htm或自定义单页模板,正文用{dede:field.body/}输出。可在单页中加入自定义字段实现地图、电话等结构化信息。
五、底部与SEO信息
1. 底部信息规范化
footer.htm中统一放置公司全称、备案号、联系方式,通过变量或单页调用避免每页手改。底部导航可调用顶级栏目,提升内链覆盖。
2. TDK与面包屑
每篇文档填写独立的标题、关键词、描述。面包屑用{dede:field.position/}调用,既利于用户,也利于搜索引擎理解层级。
六、响应式与移动端适配
- 引入
viewportmeta,使用流式布局与媒体查询。 - 导航在移动端折叠为下拉或抽屉菜单,避免横向溢出。
- 图片设置
max-width:100%,产品图集优先使用懒加载。
七、改造注意事项
建议改造完成后,逐栏目点击验证列表与详情页渲染,确认调用标签无残留输出;并通过移动端实测检查布局错位。改造过程中如涉及内核文件修改,务必记录改动点,方便后续版本升级时合并。