分享好友 最新动态首页 最新动态分类 切换频道
dedecms织梦手机模板使用和制作方法
2024-12-26 10:22

1、手机模板命名规则

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

在新织梦的default模板中,除了原有的模板外,多了些手机模板,主要手机模板如下:

     index_m.htm 首页模板

     index_default_m.htm 频道页模板

     list_default_m.htm 列表页模板

     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_m.htm 。

并且制作pc模板时,应该有一个pc模板,就做一个对应的手机模板,命名如上,这样电脑和手机访问时,对应页面都可以正常显示。

(2)手机模板调用的资源位置不同

pc模板制作时,调用的css、js、images都在模板文件夹中,例如默认default模板中的css、js、images都在其中。而手机模板调用的css、js、images等资源都在网站根目录/m/assets文件夹下。

当然我们可以在手机模板中把资源调用的位置设置到模板文件夹内。但我分析了一下,觉的默认的手机模板资源这样调用还是有好处的,把手机模板资源和pc模板 资源分开,这样当我们又做了一个pc模板,想把现有的手机模板添加到这个新pc模板中时,只需要把手机模板文件复制一份到新pc模板中就可以了,手机的 css、js等资源都不用动。简单说,就是对手机资源管理方便。

所以建议手机模板资源按照默认模板一样,放到根目录对应文件夹下。

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

新织梦的根目录下多了m文件夹,这个就是手机访问的文件夹,刚才说了手机模板资源就在m文件夹下。除此之外m文件夹下还有index.php、list.php、view.php,当我们访问手机站时,其实就是访问这3个文件,动态访问手机站。

所以如果你想用电脑查看一下自己的手机站,方法就是访问:http://你的域名/m ,就可以查看手机网站了。

(4)pc模板中的设置

当我们用手机访问网站时,会自动跳转到手机模板,这需要在pc模板中添加跳转的js代码。在<head></head>添加代码。

* 首页模板中添加如下代码:

 

  * 列表页模板添加如下代码:

<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}"></p> <p><script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else</p> <p>{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) ||</p> <p>(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-</p> <p>|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?</p> <p>mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test</p> <p>(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/list.php?tid=</p> <p>{dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>

*内容页模板添加如下代码

<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}"></p> <p><script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else</p> <p>{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) ||</p> <p>(/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?</p> <p>mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test</p> <p>(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/view.php?aid=</p> <p>{dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>

其中上面的js是电脑网站跳转到手机网站的代码,而<meta http-equiv="mobile-agent" ....>是用来告诉百度,手机网站的地址,主要用于seo。

pc模板添加上面代码后,手机访问网站时,就会自动跳转到手机网站模板了。

(5)手机模板的设置

刚才说过了手机网站访问的是网站根目录的m文件夹下的index.php,list.php,view.php ,手机网站是访问动态页面,而不像pc站中的静态页面。

手机模板制作时,有两个地方和pc模板不同。

一、栏目超链接不同

在pc模板中,如导航栏,栏目超链接调用如下:

手机模板调用栏目超链接代码如下:

  

二、文章列表超链接不同

pc模板中文章列表超链接调用代码如下:

  手机模板调用文章列表超链接代码如下:

  

除了这两个超链接不一样,其他的织梦标签通用。

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

经测试发现,默认的手机搜索模板search_m.htm不能用,但用手机搜索时,搜索结果用的是pc搜索模板search.htm 。

这是因为手机模板中搜索也是调用的pc站的搜索功能。如果需要让手机网站可以调用search_m.htm ,就需要单独设置搜索功能页面。

总结

好了,按照以上的步骤完成pc站的跳转,和手机站链接的注意事项,你就可以开始做自己的织梦手机模板了,方法和pc站模板开发类似。开发时,可以多参考默认default的手机模板

最新文章
青春绽放 创新无限
近日,由全国高校思想政治工作网、南开大学和中国移动联合主办,咪咕互动娱乐有限公司、南开大学软件学院、中国电子学会智能人机交互专委会承办的动感地带AI+高校创智计划海选赛在智慧与创意的碰撞中落幕,经过三个月的激烈比拼,50支高校
高清美女写真一键生成:探索AI绘画工具的奥秘与玩法
在这个数字化的时代,AI技术的普及使得我们可以轻松生成超逼真的美女写真。想象一下,只需简单的几步操作,你就能得到一张涵盖各类风格和细节的完美人像。这是不是让你心动呢?今天,我们将带你进入AI生成美女写真工具的世界,分析几款热门
泉州爱采购自运营
百度爱采购是如何排序的?1.时间因素:爱采购网站展示的高品质数据,并非人工介入,而是受时间因素控制,在不同的时间,同一物品会出现在不同的地点。比方说,您在采购中做了一款游泳产品,早上您查询的展示位置是在首页首行,下午再次查询
PTA: 确定班级排名
某学年的班级考评中,班名为cn1​的班级获评先进班集体,班名为cn2​的班级获评优秀学风班。经了解,该学年学院所有班级中,按班级考评的总分sc1​排名选前3个班级获评先进班集体,按学风得分sc2​排名选排
“朋友圈被领导点赞”被认定为加班证据?法院:算加班
12月10日据上海市总工会消息法院处理了一起以领导点赞朋友圈证明加班事实的劳动纠纷案一员工休息时间推广公司产品发朋友圈后领导为其点赞后该员工被公司开除主张领导朋友圈点赞应视为加班公司应支付加班费双方为此对簿公堂员工被开除,要求
滁州琅琊区蛙人水下封堵-善于管理「施工单位」(2025新+排名一览)
滁州琅琊区蛙人水下封堵-善于管理「施工单位」(2025新+排名一览)标题:滁州琅琊区蛙人水下封堵:守护城市水下安全近年来,我国城市化进程的加快,城市水下基础设施的安全维护日益受到重视。滁州琅琊区作为一座历史悠久的城市,其水下基础设
“适度宽松”所释放的重要信号(2024版)(文字版+视频版合集)
每年的年底都有定调来年楼市关键会议,今天会议也出来了,房地产相关,天狼明天在给大家细说,今晚同样也是说重点的,那么是什么样的重点呢?适度宽松,对于这四个字,稍微熟悉楼市的购房者基本是熟悉的,今晚天狼给大家说下对于楼市而言,
如何搭建小程序?
随着移动互联网的普及,小程序已经成为了一种非常流行的应用方式,因为它可以在不需要下载安装的情况下提供完整的应用体验。因此,越来越多的人开始关注如何搭建小程序。下面,我们来简单介绍一下如何搭建小程序。现在,无需找app开发公司
附件上传的大小限制
IIS6 默认允许的附件最大上传大小为4M,在IIS7之前,当我们需要扩大这个上传限制时,比如需要将允许上传的附件上限设置为50M,则可以在web.config中做如下配置:system.webhttpRuntime maxRequestLength="51200" //system.web2. maxAllowed
相关文章
推荐文章
发表评论
0评