使用 DedeCMS 内置的 is_mobile 函数（最推荐）
DedeCMS 从比较新的版本开始（V5.7 SP2 之后），已经内置了一个非常方便的函数 is_mobile()，这是最标准、最简单的判断方式。
（图片来源网络，侵删）
实现步骤：
- 打开需要判断的模板文件，
index.htm、article_article.htm等。 - 在 PHP 代码块或模板标签中，使用
if条件语句结合is_mobile()函数进行判断。
代码示例：
场景1：在首页模板 index.htm 中，为手机端和电脑端调用不同的内容
{dede:php}
// 判断是否为手机访问
if (is_mobile()) {
// 如果是手机，则包含手机版的首页模板
include(DEDETEMPLATE.'/mobile/index.htm');
} else {
// 如果不是手机（电脑访问），则正常执行模板内容
// 这里的内容就是电脑版的首页
}
{/dede:php}
<!-- 电脑端首页的默认内容（如果上面不包含，就会显示这些） -->
<div class="pc-content">
<h1>欢迎来到电脑版网站</h1>
{dede:arclist titlelen='30' row='5'}
<li><a href="[field:arcurl/]">[field:title/]</a></li>
{/dede:arclist}
</div>
场景2：在文章详情页 article_article.htm 中，为手机端和电脑端使用不同的样式
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">{dede:field.title/} - {dede:global.cfg_webname/}</title>
{dede:php}
// 动态加载不同的 CSS 文件
if (is_mobile()) {
echo '<link rel="stylesheet" href="/static/css/mobile.css">';
} else {
echo '<link rel="stylesheet" href="/static/css/pc.css">';
}
{/dede:php}
</head>
<body>
{dede:php}
// 动态加载不同的头部文件
if (is_mobile()) {
include(DEDETEMPLATE.'/mobile/header.htm');
} else {
include(DEDETEMPLATE.'/pc/header.htm');
}
{/dede:php}
<div class="main-content">
<h1>{dede:field.title/}</h1>
<div class="article-content">
{dede:field.body/}
</div>
</div>
{dede:php}
// 动态加载不同的底部文件
if (is_mobile()) {
include(DEDETEMPLATE.'/mobile/footer.htm');
} else {
include(DEDETEMPLATE.'/pc/footer.htm');
}
{/dede:php}
</body>
</html>
优点：
- 官方原生：稳定可靠,无需额外代码。
- 简单易用：一行函数搞定,代码清晰。
- 兼容性好：能正确识别大多数移动设备。
手动编写判断逻辑（适用于旧版或自定义需求）
如果你的 DedeCMS 版本比较旧，或者你想自定义判断逻辑（只识别特定手机型号）,可以手动编写判断代码。
（图片来源网络，侵删）
实现步骤：
- 打开需要判断的模板文件。
- 在模板中嵌入 PHP 代码，通过
$_SERVER['HTTP_USER_AGENT']变量来获取访问者的浏览器信息,然后判断其中是否包含移动设备的关键词。
代码示例：
{dede:php}
$is_mobile = false;
// 获取用户代理信息
$user_agent = strtolower($_SERVER['HTTP_USER_AGENT']);
// 定义常见的移动设备关键词
$mobile_agents = array(
'android', 'iphone', 'ipod', 'ipad', 'windows phone', 'blackberry', 'webos', 'opera mobi', 'palm', 'symbian', 'iemobile'
);
// 循环判断
foreach ($mobile_agents as $device) {
if (strpos($user_agent, $device) !== false) {
$is_mobile = true;
break; // 找到即退出循环
}
}
// 使用 $is_mobile 变量进行后续判断
if ($is_mobile) {
// 手机端逻辑
echo "您正在使用手机访问";
} else {
// 电脑端逻辑
echo "您正在使用电脑访问";
}
{/dede:php}
优点：
- 灵活可控：可以自由添加或删除设备关键词,实现精细化控制。
- 不依赖版本：在任何版本的 PHP 和 DedeCMS 中都能工作。
缺点：
- 需要维护：当出现新的移动设备或浏览器时，需要手动更新
$mobile_agents数组。 - 代码稍多：比
is_mobile()函数要复杂一些。
使用 JavaScript 判断（前端判断）
这种方法是在浏览器端（客户端）进行判断，而不是在服务器端，它主要用于改变页面元素的显示或行为,而不是调用不同的模板。
实现步骤：
在模板文件的 <head> 或 <body> 标签内，加入以下 JavaScript 代码。
代码示例：
<script>
// 方法一：使用正则表达式
function isMobile() {
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
}
// 方法二：使用屏幕宽度（更推荐，因为有些设备（如iPad）可以切换桌面模式）
function isMobileByWidth() {
return window.innerWidth <= 768; // 768px是一个常见的断点，可以根据需要调整
}
if (isMobileByWidth()) {
// 如果是手机，执行一些前端操作
console.log("前端判断：手机访问模式");
document.body.classList.add('mobile-view');
// 隐藏某个只在电脑端显示的元素
// document.getElementById('pc-only-element').style.display = 'none';
} else {
// 如果是电脑，执行另一些操作
console.log("前端判断：电脑访问模式");
document.body.classList.add('pc-view');
}
</script>
优点：
- 响应式设计：非常适合用于制作响应式网站,根据屏幕宽度动态调整布局和样式。
- 用户体验好：无需刷新页面即可适应不同设备。
缺点：
- 非服务器端判断：无法在服务器逻辑层面进行区分（调用不同的模板文件）。
- 可能被禁用：如果用户禁用了 JavaScript,则判断失效。
总结与最佳实践
| 方法 | 判断位置 | 优点 | 缺点 | 适用场景 |
|---|---|---|---|---|
is_mobile() 函数 |
服务器端 | 官方、简单、稳定 | 版本要求较高 | 推荐首选，用于切换不同模板、调用不同文件。 |
| 手动 PHP 判断 | 服务器端 | 灵活、不依赖版本 | 需要手动维护关键词 | 旧版 DedeCMS 或有特殊识别需求时。 |
| JavaScript 判断 | 客户端 | 响应式、用户体验好 | 非服务器端判断、依赖 JS | 制作响应式布局、动态调整前端元素样式。 |
给您的建议：
- 首选方法一 (
is_mobile())：如果你的 DedeCMS 版本较新，请务必使用这个方法，它是最规范、最省心的解决方案。 - 结合使用：在实际项目中，常常会结合使用方法一和方法三。
- 用
is_mobile()在服务器端决定加载mobile/文件夹下的模板还是pc/文件夹下的模板。 - 在加载的模板内部，再使用 JavaScript 进行更细致的前端布局调整,实现完美的响应式效果。
- 用
- 确保路径正确：在使用
include()包含模板文件时，请确保路径是正确的，推荐使用DEDETEMPLATE这个全局变量，它代表了模板目录的绝对路径，DEDETEMPLATE.'/mobile/header.htm'。
