您好!欢迎来到源码码网

织梦网站在电脑端访问手机端页面自动跳转至对应的PC端

  • 建站技巧
  • 来源:源码码网
  • 编辑:admin
  • 时间:2021-09-03 16:29
  • 阅读:1086

最近给客户部署了一套织梦的网站源码,由于要求手机端和PC端同步,所以就对移动端进行了适配。但是由于织梦移动端的模板代码是生成在m文件夹下,而对移动端又绑定了相应的二级域名。所以造成了,网站在收录的时候,收录了m文件下的html页面,但是当在电脑端查看收录页面时,会发现有很多m路径下的收录页面,当访问的时候,打开的是移动网站的页面,这样对用户体验不好,所以需要做相应的跳转,以下的解决方法是建立在PC端是静态页面、而移动端是动态调用的基础之上,如果移动端页是静态页面,请自行查找解决办法。


移动端首页跳转至PC端首页的代码:

<script type="text/javascript">

   /*判断手机端访问*/
   var isMobile = {
     Android:function(){
       return navigator.userAgent.match(/Android/i) 
       ? true:false;
     },

     BlackBerry:function(){
       return navigator.userAgent.match(/BlackBerry/i) 
       ? true:false;
     },

     iOS:function(){
       return navigator.userAgent.match(/iPhone|iPad|iPod/i) 
       ? true:false;
     },

     Windows:function(){
       return navigator.userAgent.match(/IEMobile/i) 
       ? true:false;
     },

     any:function(){
       return (isMobile.Android()||isMobile.BlackBerry() 
       ||isMobile.iOS()||isMobile.Windows());
     }

   };

     if(!isMobile.any()) {
       window.location.href = "PC端网址";
    }
 </script>


移动端文章页面跳转至PC端代码:

<script type="text/javascript">

   /*判断手机端访问*/
   var isMobile = {
   Android:function(){
      return navigator.userAgent.match(/Android/i) 
      ? true:false;
   },

    BlackBerry:function(){
      return navigator.userAgent.match(/BlackBerry/i) 
      ? true:false;
   },

   iOS:function(){
      return navigator.userAgent.match(/iPhone|iPad|iPod/i)
      ? true:false;
   },

   Windows:function(){
      return navigator.userAgent.match(/IEMobile/i)
      ? true:false;
   },

   any:function(){
      return (isMobile.Android()||isMobile.BlackBerry() 
      || isMobile.iOS()||isMobile.Windows());
   }

  };

    if(!isMobile.any()) {
      window.location.href = "{dede:field.id runphp='yes'}
      $id=@me;@me='';$url=GetOneArchive($id);
      @me=$url['arcurl'];{/dede:field.id}";
 }
 </script>


image.png


移动端列表页面跳转至PC端代码:

把以下代码加到 /include/helpers/extend.helper.php 文件最后。

if ( ! function_exists('itemCurUrl'))
{
    /**
     * 获取当前列表页或内容页的URL
     * 未经大量测试,一定会有不如意的地方,使用时注意测试观察
     *
     * 列表页使用方法:
     * dede:field.id runphp='yes'}@me=itemCurUrl(@me,'list');
     {/dede:field.id}
     * 内容页使用方法:
     * 
     dede:field.id runphp='yes'}@me=itemCurUrl(@me,'view');
     {/dede:field.id}
     *
     * @param int $id 列表ID或文章ID
     * @param string $type 分类,list:列表页,view:内容页
     * @return string
     */
function itemCurUrl($id, $type='list') {
  global $dsql;
  if($type == 'list'){
    $sql="SELECT * FROM `dede_arctype` WHERE `id`='$id' ";
    $info=$dsql->GetOne($sql);
    $url=GetOneTypeUrlA($info);
      return $url;
    }else{
      $arr = GetOneArchive($id);
      if(!empty($arr['ismake'])){ // 静态页面
        return $arr['arcurl'];
      }else{ // 动态页面
        return '/plus/view.php?aid='.$arr['aid'];
     }
   }
  }
}


然后在列表页的head部分加入以下代码:

<script type="text/javascript">

   /*判断手机端访问*/
   var isMobile = {
   Android: function () {
     return navigator.userAgent.match(/Android/i) 
     ? true:false;
   },

   BlackBerry:function(){
     return navigator.userAgent.match(/BlackBerry/i) 
     ? true:false;
   },

   iOS:function(){
     return navigator.userAgent.match(/iPhone|iPad|iPod/i) 
     ? true:false;
   },

   Windows:function(){
     return navigator.userAgent.match(/IEMobile/i) 
     ? true:false;
   },

   any:function(){
     return (isMobile.Android()||isMobile.BlackBerry() 
     || isMobile.iOS()||isMobile.Windows());
   }

 };

    if (!isMobile.any()) {
     window.location.href = "{dede:field.id runphp='yes'}
     @me=itemCurUrl(@me,'list');{/dede:field.id}"
   }
 </script>


以上代码由本站亲自测试,可正常运行。


特别声明:
1、如无特殊说明,内容均为本站原创发布,转载请注明出处;
2、部分转载文章已注明出处,转载目的为学习和交流,如有侵犯,请联系客服删除;
3、编辑非《源码码网》的文章均由用户编辑发布,不代表本站立场,如涉及侵犯,请联系删除;
全部评论(0)
推荐阅读
  • bootstrap ui框架能用在uniapp中吗?
  • bootstrap ui框架能用在uniapp中吗?
  • BootstrapUI框架通常是前端开发中的一种工具,它提供了一套预定义的CSS样式和组件,用于快速构建响应式布局的网页。然而,UniApp是一个使用Vue.js开发跨平台应用的框架,它可以用来开发iOS、Android、以及各种小程序和H5应用。
  • 互动社区
  • 来源:源码码网
  • 编辑:热度建站
  • 时间:2024-04-12 00:04
  • 阅读:184
  • css实现banner图由中心点动态放大效果
  • css实现banner图由中心点动态放大效果
  • 在日常的网页设计中,为了让网页增加一定的特效以达到交互的目的,我们尝尝会在网页中使用一些动画效果。今天来说说实现banner图由中心点动态放大效果,实现这个效果需要用到css中的动画:animation​和关键帧:@keyframes,具体示例如下:
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-04-11 18:52
  • 阅读:197
  • countUp.js实现鼠标滑动到某个位置数字自动滚动增加的效果
  • countUp.js实现鼠标滑动到某个位置数字自动滚动增加的效果
  • 在网页开发中为了提升网页的交互效果,经常会用到使用js给网页增加一定的特效,下边就来说说使用js实现鼠标滑动到某个位置数字自动滚动增加的效果。其实这种效果有很多中解决办法,自己也可以去写,下边我们借助countUp.js来实现,关于这个js文件,我放在末尾:
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-04-08 09:20
  • 阅读:273
  • 响应式网页设计思路及注意事项
  • 响应式网页设计思路及注意事项
  • 一、什么是响应式网页响应式网页设计就是让网页具有根据设备类型应用CSS样式的能力。设计:设想、计划。设计就是把想法实现。网页设计:按照一定的设计思路布局网页内容。传统网页设计:都是针对PC端浏览器而设计的,不具备查询设备的能力,更不能对多种访问设备做出响应。传统网页设计的弊端:在移动互联网时代,传统的网页设计不适合多屏幕时代。响应式网页设计应运而生。响应式网页设计是一种设计网页的思想/方法。响应:指让我们的网页能够自动查询用户的访问设备
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-04-02 11:24
  • 阅读:180
  • css中rel的属性值都有哪些,分别代表什么意思
  • css中rel的属性值都有哪些,分别代表什么意思
  • 在HTML中,元素的rel属性用于定义当前文档与被链接文档之间的关系。这个属性在CSS的上下文中经常与样式表关联,但rel属性的用途远不止于此。以下是一些常见的rel属性值及其意义:1、stylesheet:表示被链接的文档是一个样式表。这通常用于链接CSS文件。
  • 源码教程
  • 来源:源码码网
  • 编辑:源码码网
  • 时间:2024-03-28 12:28
  • 阅读:309
联系客服
源码代售 源码咨询 素材咨询 联系客服
029-84538663
手机版

扫一扫进手机版
返回顶部