织梦dedecms PC移动端同一后台

最近花了几天时间研究了一下关于织梦统一后台的功能。

百度了许多方法都不灵验。在自己尝试了几种方法后,目前这种可行。

两个参考链接:https://blog.csdn.net/linhui03/article/details/78536485   ||  https://www.jb51.net/cms/491933.html

首先前提是:在已经做好的PC端上增加手机端

1,把移动端的css、js、images文件放到根目录下m文件夹下,或者/m/assets文件夹下

(建议移动端的图片和pc端的图片放在同一个文件夹便于管理)

调用:<link href="{dede:global.cfg_mobileurl/}/css/phonestyle.css" rel="stylesheet"> 或者

<link href="{dede:global.cfg_mobileurl/}/assets/css/phonestyle.css" rel="stylesheet">

{dede:global.cfg_mobileurl/} 表示m文件下夹面 当上面这样写路径错误时。

 

当把下面的js跳转判断加在了pc模板头部<head></head>的时候

移动端调用的css、js样式路径就直接为

<link href="css/style.css" rel="stylesheet"> 前提:把移动端的css、js文件放到根目录下m文件夹下

因为下面js判断了手机端 加载到了m文件夹下面 

所以前面的{dede:global.cfg_mobileurl/} 就可以不加了 导致重复 (不加可以解析就不加,没有解析就加)。

2,把pc端的和手机端的模板放在一个文件夹下,手机端页面后缀_m (与default同级 )

3,在套移动端的摸板时,跟PC端的区别,其他都一样:

很重要的说明!!!

最重要的一点 查看/更改手机端的样式要在后台切换到手机模板(模板不正确更新是无效的) 这个很坑!!!

一键更新手机模板:https://blog.csdn.net/a772116804/article/details/81631097

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

全部加在pc模板头部<head></head>添加代码。

其中下面的<meta http-equiv="mobile-agent" ....>是用来告诉百度,手机网站的地址,主要用于seo。

<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/index.php">
<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}">
<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}">

1)首页跳转js

<script type="text/javascript">
if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) ||(/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("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/index.php";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}
</script>

2)列表页跳转js

<script type="text/javascript">
if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) ||(/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("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}
</script>

3)内容页跳转js

<script type="text/javascript">
if(window.location.toString().indexOf('pref=padindex')!=-1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) ||(/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("?mobile")<0){try{if(/Android|WindowsPhone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}
</script>

也可以直接采用js在pc端头部判断是否为手机端:

<script type="text/javascript">
		var is_iPd = navigator.userAgent.match(/(iPod|iPhone)/i) != null;
		var is_mobi = navigator.userAgent.toLowerCase().match(/(ipod|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|win ce)/i) != null;
		if(is_mobi && window.location.search.indexOf("mv=fp")<0)
		{
			window.location.href="/m/";//因为织梦的手机端在m文件夹下跳转
		}
	</script>

然后也可以跳到m下。很开心,可以解析 (如果{dede:global.cfg_mobileurl/}解析不了 就直接写m)

{dede:global.cfg_mobileurl/} = m;

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

移动端命名:header_m.htm,footer_m.htm,index_m.htm

调用头部尾部:

{dede:include filename="header_m.htm"/}

{dede:include filename="footer_m.htm"/}

总结一下最重要的:

1,采用js判断加载移动端,m文件夹下面

2,所有css,js文件放到根目录下m文件夹下,或者/m/assets文件夹下 

(建议移动端的图片和pc端的图片放在同一个文件夹便于管理)

手机模板的设置

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

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

一、栏目超链接不同

在手机模板中,如导航栏,栏目超链接调用如下:(手机端上跳列表页的链接)

{dede:channel type='top' row='10' typeid='2' }
            <li><a href='list.php?tid=[field:id/]' [field:rel/]>[field:typename/]</a></li>
 {/dede:channel}

手机模板调用列表超链接代码如下:(手机端上跳详情页的链接)

{dede:arclist row='10' typeid='3' }
          <p><a href='view.php?aid=[field:id/]' >这是文章标题:[field:title/]</a></p>
{/dede:arclist}

手机端首页用 arclist 解析  list 解析不出。

手机首页调用举例:

<ul>
          {dede:arclist typeid='22' row='50' imgwidth='189' imgheight='160'}
              <li class="cur">
                     <a href="view.php?aid=[field:id/]">[field:image/]</a>
                    <p><a href="view.php?aid=[field:id/]" title="[field:fulltitle/]">[field:fulltitle/]</a></p>
              </li>
       {/dede:arclist}
 </ul>

列表页调用举例:

<ul>
     {dede:list pagesize='5' typeid='3'}
         <li>
            <a href="[field:arcurl/]">[field:title/]</a>
            <span>[field:pubdate function="MyDate('Y-m-d',@me)"/]</span>
        </li>
    {/dede:list}   
 </ul>

dede:list 在手机列表页可以调用不同typeid下的文章,配合显示分页

分页:

 <ul>
             {dede:pagelist listitem="pre,next,pageno"/}
   </ul>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

林中明月间。

分享共赢。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值