织梦手机模板怎么设置？-织梦建站-盈思创科技

核心思路

织梦实现手机模板切换的原理是：

（图片来源网络，侵删）

创建两套模板：一套是PC端模板，一套是手机端模板。
修改系统配置：在后台告诉织梦，手机端模板的存放位置和默认的移动端首页模板文件名。
添加识别代码：在PC端模板的关键位置（通常是<head>标签内）加入一段PHP代码，用于检测访问设备。
实现跳转：当检测到是手机访问时，代码会自动跳转到你指定的移动端首页。

详细操作步骤

第一步：创建手机模板目录和文件

创建手机模板目录
- 通过FTP或你的主机控制面板,进入织梦程序的安装目录。
- 找到 /templets/ 目录。
- 在 /templets/ 目录下，新建一个文件夹，命名为 mobile，这个文件夹将专门用来存放所有手机端的模板文件。
- 你的目录结构看起来会是这样：/templets/ (PC模板) 和 /templets/mobile/ (手机模板)。
复制并修改模板文件
- 将你PC端正在使用的模板文件（index.htm, list_article.htm, article_article.htm 等）从 /templets/ 目录复制一份到 /templets/mobile/ 目录中。
- 重要：不要直接移动，而是复制，这样PC端和手机端的模板就分开了，你可以独立修改它们。
- 在 /templets/mobile/ 目录中，将你希望作为手机首页的文件重命名为 index.htm，如果你复制过来的文件是 default_index.htm，就把它改名为 index.htm。
修改手机端模板
- 现在你可以在 /templets/mobile/ 目录下，使用任何HTML编辑器（如VS Code, Sublime Text, Dreamweaver）来修改这些手机模板。
- 建议：
  - 简化代码：移除PC端复杂的JS和CSS，使用更轻量级的代码。
  - 响应式设计：使用 viewport 标签和响应式CSS（如媒体查询 @media），让模板在不同尺寸的手机上都能良好显示。
  - 优化布局：将多栏布局改为单栏，增大字体和按钮尺寸，方便触摸操作。

第二步：修改PC端模板，添加设备识别代码

这是实现自动跳转最关键的一步。

（图片来源网络，侵删）

打开PC端的首页模板
- 登录织梦后台,进入【模板】->【模板管理】->【默认模板管理】。
- 找到你当前正在使用的PC端首页模板（通常是 index.htm），点击后面的【编辑】按钮。

添加识别代码

在模板代码中,找到 <head> 和 </head>
在 <head> 标签内的最后面，粘贴以下PHP代码：


<?php
if (isset($_GET['mobile'])) {
    $mobile = $_GET['mobile'];
    if ($mobile == 'no') {
        setcookie('dedecms_mobile', 'no', time() + 3600 * 24 * 30); // PC端访问，30天内不跳转
    } else {
        setcookie('dedecms_mobile', '', -3600); // 删除cookie
    }
}
if (isset($_COOKIE['dedecms_mobile']) && $_COOKIE['dedecms_mobile'] == 'no') {
    // 如果用户设置了不跳转，则不执行任何操作
} else {
    // 自动识别手机并跳转
    if (isset($_SERVER['HTTP_USER_AGENT'])) {
        $clientuseragent = strtolower($_SERVER['HTTP_USER_AGENT']);
        $clientkeywords = array(
            'mobile', 'nokia', 'sony', 'ericsson', 'mot', 'samsung', 'htc', 'sgh', 'lg', 'sharp', 'sie-', 'philips', 'panasonic', 'alcatel', 'lenovo', 'iphone', 'ipod', 'blackberry', 'meizu', 'android', 'netfront', 'symbian', 'ucweb', 'windowsce', 'palm', 'operamini', 'operamobi', 'openwave', 'nexusone', 'cldc', 'midp', 'wap', 'mobile'
        );
        if (preg_match("/(" . implode('|', $clientkeywords) . ")/i", $clientuseragent) && strpos($clientuseragent, 'ipad') === false) {
            header("Location: /m/"); // 跳转到 /m/ 目录
            exit;
        }
    }
}
?>



保存模板
点击【保存】按钮。
（图片来源网络，侵删）


代码解释：

这段代码首先检查URL中是否有 ?mobile=no 参数，如果有，就设置一个30天的Cookie，告诉网站“我在电脑上，别再跳了”。
然后它检查用户的 User-Agent（浏览器标识信息），看是否包含常见的手机关键词（如 'mobile', 'iphone', 'android' 等）。
如果是手机访问,并且用户没有设置“不跳转”的Cookie，代码就会执行 header("Location: /m/");，将用户重定向到 /m/ 这个目录。

第三步：设置移动端首页和栏目页
织梦默认不会自动为所有手机页面生成模板,所以我们需要手动指定。

登录后台，进入【系统】-> 【系统基本参数】。
在左侧菜单中,点击 【核心设置】。
找到以下两个选项并进行设置：
(mobile)移动端网站首页模板
点击右侧的【选择】按钮。
在弹出的窗口中,选择你之前创建的 /templets/mobile/ 目录下的 index.htm 文件。
点击【选择】。


(mobile)移动端网站栏目页模板
同样,点击右侧的【选择】按钮。
选择 /templets/mobile/ 目录下的 list_article.htm 文件（这是手机端的列表页模板）。
点击【选择】。




点击页面底部的【保存】按钮。

第四步：创建 /m/ 目录并配置首页
还记得第二步中跳转代码里的 header("Location: /m/"); 吗？现在我们需要创建这个目录，并让它指向我们的手机模板。


创建 /m/ 目录

通过FTP,在织梦程序的根目录（与 /dede/, /templets/, /include/ 等同级）下，创建一个名为 m 的文件夹。



配置 /m/ 目录为手机首页

登录织梦后台,进入【模板】-> 【默认首页管理】。
在页面顶部,你会看到一个“设置首页”的下拉菜单。
从下拉菜单中选择 “m”。
点击【设置】按钮。

这个操作会自动在 /m/ 目录下生成一个 index.php 文件，这个文件的作用就是加载你在【核心设置】中指定的手机端首页模板 (/templets/mobile/index.htm)。


第五步：测试和优化


测试跳转

用电脑浏览器访问你的网站首页,应该不会跳转。
用手机浏览器访问你的网站首页,应该会自动跳转到 你的域名/m/。
如果想从手机切换回PC端查看,可以在网址后面加上 ?mobile=no，你的域名/m/?mobile=no，这样设置后，在30天内用这个手机访问都不会再跳转了。



优化其他页面

现在只有首页和栏目页设置了手机模板,文章页（内容页）可能还是PC模板。
你需要为文章页也创建一个手机模板（article_article.htm），并按照第三步的流程，在【核心设置】中设置 “(mobile)移动端网站文章页模板”。



SEO优化（可选但推荐）

为了搜索引擎更好地识别你的移动站,建议在PC端模板的<head>里添加 <link rel="alternate" media="only screen and (max-width: 640px)" href="https://你的域名/m/" />。
在手机端模板的<head>里添加 <link rel="canonical" href="https://你的域名/对应的PC页面URL" />，这告诉搜索引擎，https://你的域名/m/ 是 https://你的域名/ 的移动版本。




设置织梦手机模板的流程可以概括为：

建目录：在 /templets/ 下建 mobile 文件夹。
改模板：复制PC模板到 mobile 文件夹，并修改成手机样式。
加代码：在PC端模板的 <head> 里加设备识别和跳转PHP代码。
设后台：在后台【系统基本参数】->【核心设置】里指定手机模板文件。
建入口：在根目录建 m 文件夹，并在后台【默认首页管理】里把它设为首页。

按照以上步骤操作,你就可以成功地为你的织梦网站设置好手机模板了，如果在操作中遇到问题，可以检查一下文件路径是否正确，代码是否完整保存。

织梦手机模板怎么设置？

核心思路

详细操作步骤

第一步：创建手机模板目录和文件

第二步：修改PC端模板，添加设备识别代码

第三步：设置移动端首页和栏目页

第四步：创建 `/m/` 目录并配置首页

第五步：测试和优化

相关文章

目录[+]