dedecms 织梦jmobile风格wap模板:基于jquery mobile 的手机移动设备dedecms模板发布

目录
[隐藏]

dedecms 的模板非常丰富,但免费质量又好的并不多(如您有好用的请分享给我@任侠,感谢!),而基于移动端的 wap 模板更少见,志文工作室在搜寻良久无所获后,才下决心自行设计开发。开发完了不能忘记共享精神,于是在这里免费发布。

特性简介

  • 漂亮的界面、切换效果;
  • 简单实现的上下文链接;
  • 手势控制、文章页触控翻页;
  • 菜单设置;
  • 分享菜单;
  • 本地收藏;
  • 伪静态支持;
  • 图库栏目支持;
  • 多主题切换;
  • +++

其他实用功能继续增加中!

安装方法

解压缩下载的压缩包,复制到根目录进行替换即可。

wap 方式

直接访问:http://网址/wap.php

伪静态方式

需要配置服务器伪静态,nginx 配置参考如下:

    #mobile
    rewrite ^/m/?$  /wap.php?tmpl=m last;
    rewrite ^/m/list/(\d+)/?$  /wap.php?action=list&typeid=$1&tmpl=m last;
    rewrite ^/m/article/(\d+)/(\d+)/?$  /wap.php?action=article&typeid=$1&id=$2&tmpl=m last;
    rewrite ^/m/images/(\d+)/(\d+)/?$  /wap.php?action=images&typeid=$1&id=$2&tmpl=m last;
    rewrite ^/m/wapsearch/(\d+)/?$  /wap.php?action=list&typeid=$1&tmpl=m last;
    rewrite ^/m/p/(\d+)/(\d+)/?$ /wap.php?p=$1&pz=$2&tmpl=m last;
    #wap 方式使用重定向
    rewrite ^/wap(.*) /m permanent;
    #rewrite ^/wap/?(\.php)?(.*)    /wap.php$2 break;

其他服务器请参照自写。配置成功后,以如下方式访问:

http://网址/m/

注意事项:

基于dedecms 织梦的 wap 进行了少许的二次开发,替换前请备份如下文件:

templets/wap/ 目录 wap.php 文件

关于界面,具体可看演示或截图;

关于主题

自带了五套简单设计的主题,你也可以自定义你的主题。步骤参考如下:

a. 打开如下地址,进入主题定制网站页面:

http://themeroller.jquerymobile.com/

b. 点击 “Import” 按钮,弹出主题导入对话框,下拉列表中选择 1.4.5 版本;

c. 打开如下文件并复制内容,将其粘贴进对话框中

templets\asset\jmobile\themes\lzw_dede_wap.css

操作成功,即可看到 A-E 的五种主题,分别对应侧边栏的五种主题设置。

d. 修改侧边栏的不同主题设置,可实时看到对应主题效果的变化。

e. 主题定制完成,点击 Download 按钮下载主题,解压并复制替换 templets\asset\jmobile\themes\ 目录中的文件。

其他相关

站点:http://w.lzw.me

演示:http://w.lzw.me/wap
作者:@任侠
支持:@志文工作室 http://lzw.me
日期:2013-10-25
更新:2015-04-16

下载地址

dede_templet_jmobile_wap.2013.08.27.0225

最新版本下载

开源网站:http://git.oschina.net/lzw/dedecms_jqm_template/attach_files

 

效果截图

首页:
index_1

列表页:
list_1

菜单:
menu_1

内容页1:
content_1

内容页2:
content_2

点赞 (0)
  1. 女儿国说道:
    Google Chrome 31.0.1650.63 Google Chrome 31.0.1650.63 Windows 7 Windows 7

    你好我想问下我的是万网的主机要怎么用那个伪静态规则呢?我把你写的那个伪静态保存在根目录中的.htaccess显示错误500网站打不开了,请问要怎么写?谢谢,不胜感激。

    1. 任侠说道:
      Google Chrome 46.0.2490.80 Google Chrome 46.0.2490.80 Windows 7 x64 Edition Windows 7 x64 Edition

      我给的伪静态是 nginx 的,Apache 的规则写法不一样

    2. 美女图片网说道:
      Google Chrome 45.0.2454.101 Google Chrome 45.0.2454.101 Windows 7 x64 Edition Windows 7 x64 Edition

      博主您好还有,我看你的这个说明e. 主题定制完成,点击 Download 按钮下载主题,解压并复制替换 templets\asset\jmobile\themes\ 目录中的文件。我下载的没有这个目录呀

  2. rudy说道:
    Google Chrome 31.0.1650.63 Google Chrome 31.0.1650.63 Windows 7 x64 Edition Windows 7 x64 Edition

    在搜索时,显示自定义搜索模型不存在

    1. 任侠说道:
      Google Chrome 43.0.2357.132 Google Chrome 43.0.2357.132 Windows 7 x64 Edition Windows 7 x64 Edition

      该问题到dede官网或百度查找一下,有详细解决方案

  3. 喜欢说道:
    Google Chrome 41.0.2272.89 Google Chrome 41.0.2272.89 Windows XP Windows XP

    不错 不错 刚测试一下 但是发现 如果是 图片站,图片站本身 图片内容里面 是有分页的,一张图片一页,,但是 这个wap 直接 就一个页面显示了 全部 图片了 希望能改进

    最后 如果能开发也能像pc版一样 同样能生成 静态页面就完美多了

  4. 喜欢说道:
    Google Chrome 41.0.2272.89 Google Chrome 41.0.2272.89 Windows XP Windows XP

    如果能 弄一个 同时生成pc 静态页面 也能生成手机静态页面的就更好了,。。手机现在是动态的不是很好 希望能 继续开发一下 和大家分享

  5. 感谢志文兄说道:
    Google Chrome 40.0.2214.111 Google Chrome 40.0.2214.111 Windows XP Windows XP

    志文兄,直接上传后无法实现您这个效果,根目录没有/m的文件夹,请问目录需要怎么修改

    1. 任侠说道:
      Google Chrome 36.0.1985.125 Google Chrome 36.0.1985.125 Windows 7 x64 Edition Windows 7 x64 Edition

      需要配置伪静态 urlrewrite,参见伪静态说明。否则直接使用 /wap.php 访问即可。

  6. 说得好啊说道:
    Google Chrome 30.0.1599.101 Google Chrome 30.0.1599.101 Windows XP Windows XP

    给楼主赞一个!顺便问问楼主,对于新手来讲,搞这些东西需要掌握php么

    1. 任侠说道:
      Google Chrome 36.0.1985.125 Google Chrome 36.0.1985.125 Windows 7 x64 Edition Windows 7 x64 Edition

      不需要。需要掌握简单的网页知识。掌握PHP的话更好

  7. Google Chrome 39.0.2171.71 Google Chrome 39.0.2171.71 Windows 7 Windows 7

    这个模板不错,准备用下。请问楼主,如何把栏目固定在上方,不用浮在下方!

  8. 乐享资讯说道:
    Google Chrome 38.0.2125.111 Google Chrome 38.0.2125.111 Windows XP Windows XP

    这个模板挺好的,我自己前段时间也用jqueryMobile做了一套!

  9. 小晓说道:
    Google Chrome 24.0.1312.57 Google Chrome 24.0.1312.57 Windows XP Windows XP

    支持哟,找了很久, :razz:

  10. hogface说道:
    Google Chrome 36.0.1985.125 Google Chrome 36.0.1985.125 Windows XP Windows XP

    我想修改颜色风格为绿色,不知道如何修改。

    1. 任侠说道:
      Google Chrome 36.0.1985.125 Google Chrome 36.0.1985.125 Windows 7 x64 Edition Windows 7 x64 Edition

      默认只有五套主题。你可以到这里定制,设计完后下载定制的样式。注意版本选择 1.3.2
      http://themeroller.jquerymobile.com/

      1. hogface说道:
        Google Chrome 36.0.1985.125 Google Chrome 36.0.1985.125 Windows XP Windows XP

        下载的样式覆盖几个文件?我试了不行呢。。

  11. 凌冬将至说道:
    Firefox 29.0 Firefox 29.0 Windows XP Windows XP

    你好 首页一级分类 超过三个就会变样
    是否可以超过三个 也能保持不变形 自动切换成上下两排 呢
    $dsql->SetQuery("Select id,typename From `#@__arctype` where reid=0 And channeltype=1 And ishidden=0 And ispart2 order by sortrank limit 3");

    1. 任侠说道:
      Google Chrome 34.0.1847.116 Google Chrome 34.0.1847.116 Windows 7 Windows 7

      在模板文件里,取消顶部固定的配置
      <div data-role='footer' data-theme='b' data-position='fixed'></div>
      改为
      <div data-role='footer' data-theme='b'></div>

      1. 凌冬将至说道:
        Firefox 29.0 Firefox 29.0