悠悠楠杉
网站页面
DEDECMS手机站建设与移动端模板设置全攻略
09/06
DEDECMS手机站建设与移动端模板设置全攻略
一、手机站建设基础准备
在移动互联网时代，企业网站没有适配移动端相当于主动放弃50%以上的流量。使用DEDECMS搭建手机站需要做好以下前期准备：
服务器环境检测
确保服务器支持PHP5.6+和MySQL5.0+，建议开启Gzip压缩功能。通过phpinfo()检查是否安装mbstring扩展（解决编码问题关键）。核心文件备份
修改前务必备份：/templets/、/include/、/data/ 三个核心目录，建议使用SVN或Git进行版本控制。域名解析策略
推荐采用二级域名（m.xxx.com）或自适应方案。如需单独绑定域名，需在.htaccess添加：
apache RewriteCond %{HTTP_HOST} ^m.xxx.com$ [NC] RewriteRule ^(.*)$ /m/$1 [L]
二、移动端模板制作详解
（一）模板选择与创建
在/templets/目录下新建
mobile文件夹，建议复制default模板后进行精简：
- 删除PC端专用JS/CSS
- 保留核心文件：articlem.htm、indexm.htm、list_m.htm
关键模板文件改造要点：html
（二）CSS适配技巧
推荐使用REM布局方案：css
/* 基准值设置 */
html{font-size:62.5%;}
body{font-size:1.4rem;line-height:1.5;}
/* 图片自适应 */
img{max-width:100%;height:auto;}
/* 导航栏改造 */
.nav-bar{
display:-webkit-box;
-webkit-box-orient:horizontal;
overflow-x:auto;
}
三、后台关键配置步骤
模板绑定设置
进入系统后台 → 核心 → 网站栏目管理 → 更改栏目，在"高级选项"中设置：
- 封面模板：mobile/index_m.htm
- 列表模板：mobile/list_m.htm
- 文章模板：mobile/article_m.htm
移动端检测代码
在/include/extend.func.php添加：
php function is_mobile(){ $useragent = strtolower($_SERVER['HTTP_USER_AGENT']); return preg_match('/iphone|android|ipod|windows phone/', $useragent); }URL路由优化
修改/include/helpers/channelunit.helper.php，在GetOneTypeUrl函数中加入：
php if(is_mobile() && $this->TypeID!=0){ $typelink = str_replace('/default/', '/mobile/', $typelink); }
四、常见问题解决方案
问题1：图片不自适应
解决方法：在内容页模板添加JS处理：
javascript
$(".article-content img").each(function(){
$(this).attr("style","").css({"max-width":"100%","height":"auto"});
});
问题2：表单输入错位
需在CSS中加入：
css
input, textarea, select{
-webkit-appearance:none;
border-radius:0;
font-size:1.6rem;
padding:0.5rem;
}
问题3：缓存不更新
强制更新方法：
1. 删除/data/tplcache/下所有文件
2. 后台 → 系统 → 系统设置 → 性能选项 → 关闭模板缓存
五、高级优化建议
CDN加速配置
修改/include/vdimgck.php，将图片路径替换为：
php $cfg_multi_site = 'Y'; $cfg_mainsite = '//cdn.xxx.com';AMP页面支持
创建/amp/目录并制作简化模板，在头部添加：
html <link rel="amphtml" href="//m.xxx.com/amp/<?php echo $aid;?>.html">PWA集成方案
在根目录添加manifest.json：
json { "name": "移动站点", "short_name": "APP", "start_url": "/m/", "display": "standalone", "background_color": "#fff" }
通过以上步骤，可以打造出体验优秀的DEDECMS移动站点。建议每月检查一次移动端跳出率数据，持续优化模板细节。
