dedecms织梦手机模板使用和制作方法

dedecms织梦手机模板使用和制作方法

最新版本的DEDEDECMS系统为移动终端增加了许多设计方案。Dreamweaver升级后，默认设置的默认模板包括手机模板，所以我们可以为Dreamweaver网站制作双模板，电脑版的pc模板，手机版的wap模板。在这里，我们将详细介绍DEDEDECMSDreamweaver手机模板的应用和制作方法。如果有必要，我们可以效仿。

在制作模板时，我们通常会参考织梦默认设置模板中的logo应用。所以我们来分析一下手机模板在织梦默认设置模板中的应用。

注意:本示例教程适用于具有开发和设计Dreamweaver模板经验的网站管理员。如果是初学者，建议先了解一下Dreamweaverpc模板开发设计。

1。手机模板命名规范

新织梦的默认模板里，除了原来的模板，还多了一些手机模板。主要的手机模板如下:

Index_m.htm主页模板

index_default_m.htm频道的栏目页面模板

list_default_m.html列表页面模板

list_default_sg_m.htm列表页面模板

Article_article_m.htm内容页面模板

Article_default_m.htm内容页面默认设置模板

Search_m.htm检索页面模板

Head_m.htm顶层模板

Footer_m.htm底部模板

认识制作智萌电脑版网页模板的站长，一眼就能大致搞清楚这个手机模板的使用和制作方法。这个手机模板和pc模板在制作和启用上有一些区别。先说实际的区别。

2。手机模板不同于pc模板

(1)手机模板名称不同

从上面手机模板的名字可以看出，手机模板的名字和pc模板的区别在于pc模板后面加了“_m”。比如pc主页模板是index.htm，匹配的手机模板是index_m.htm；pc的列表页模板是list_article.htm，匹配的手机列表页模板是list_article.htm。

而且在制作pc模板的时候，要有pc模板，做一个匹配的手机模板就行了，命名如上，这样在电脑和手机上浏览的时候，所有匹配的网页都能正常显示信息。

(2)手机模板启用的资源不同

制作pc模板时，启用的css、js、images会在template文件夹中，比如默认模板中的css、js、images。手机模板启用的css、js、图片等资源将位于网站根目录的/m/assets文件夹中。

自然，我们可以将手机模板中启用资源的部分设置到模板文件夹中。但是分析了一下，我觉得像那样启用默认的手机模板资源还是有好处的。把手机模板资源和pc模板资源分开，这样当我们制作另一个pc模板，想把当前的手机模板添加到这个新的pc模板上时，只需要把手机模板文档复制到新的pc模板上，手机上的css，js等资源就不用动了。简单来说就是手机资源管理方式方便。

所以建议将手机模板资源放在网站根目录的匹配文件夹中作为默认模板。

(3)URL网站根目录的M文件夹

新织梦的根目录下多了M个文件夹，就是手机上浏览的文件夹。刚才说了，手机模板资源在M文件夹下。此外，M文件夹中还有index.php、list.php和view.php。我们在浏览手机网站的时候，其实就是浏览这三个文档，动态浏览手机网站。

所以想用电脑查手机网站，可以通过浏览:http://你的网站域名/m来查手机网站。

(4)PC模板中的设置

当我们用手机浏览网站时，会跳转到手机模板，手机模板必须添加自动跳转到pc模板的js代码。在

*将以下代码添加到主页模板中:

复制代码如下:

*列表页面模板加上以下代码:

复制代码如下:

*内容页面模板加上以下代码

复制代码如下:

最上面的js是电脑版网页自动跳转到手机网页的代码，而

pc模板添加以上代码后，在手机上浏览网站时，会跳转到手机网页模板。

(5)手机模板的设置

我刚才说我在手机上的网站根目录的M文件夹里访问了index.php、list.php和view.php。手机页面是动态页面，不是pc站中的静态页面。

手机模板做出来的时候，有两个区域和pc模板不一样。

首先，频道网页的链接不同

在电脑模板中，如导航栏，频道网页链接的启用方式如下:

复制代码编码如下:
{dede:channeltype='top'row='10'}

手机启用频道的超链接代码如下:

复制代码编码如下:
{dede:channeltype='top'row='10'}

二、文章内容列表不同于网页链接

pc模板中文章内容列表的web链接启用了以下代码:

复制代码如下:
{dede:arclistrow='10'}

手机启用文章内容列表的超链接代码如下:

复制代码如下:
{dede:arclistrow='10'}

除了这两个网络链接的区别，其他的梦想编织标志都是通用的。

(6)不能使用默认的手机搜索页面模板search_m.htm

经过测试，发现默认的手机搜索模板search_m.htm无法使用，但是用手机搜索时，百度搜索使用的是pc搜索模板search.htm。

这是因为手机模板中的搜索也是启用的pc站的搜索功能。如果手机网页必须启用search_m.htm，那么搜索页面必须独立设置。

摘要[/s2/]

好了，按照上面的流程自动跳转到pc站，以及连接手机网站的常见问题，就可以直接开始制作自己的Dreamweaver手机模板了，类似于pc站模板的开发设计。设计时可以参考默认设置的手机模板。有兴趣的朋友，赶紧试试自己的动手能力吧。如果有什么问题，可以在留言板上留言，我会尽快给你回复。