PHPCMS完成手机端搭建全教程（新手看完即会）

注：这篇文章是在我做完一个自适应和一个响应式网站后写的。

所以我建议，如果可以的话，最好用@media css做响应式网站，这样就不用考虑手机端的各种问题。

因为我当初做的就是自适应，但是没有想到后面的坑是非常多。（第一次用phpcms）

首先1：是两端就要有两个模板，那么修改代码就要改两份。（维护也不容易）

然后2：在给网站做伪静态的时候更麻烦，我本来PC端就做好了，但是不会php，所以最后还是花钱请人帮我弄了手机端的伪静态

其次3：因为我自适应那个网站要做筛选，所以在手机端上也是请人帮我写的分页php代码，加班到凌晨两点，直接睡在公司。

接着4：后面网站上线要做SEO关键词和优化，更加麻烦。由于手机端不能在后台设置，我只能弄了很多个header模板。—__—

最后：做响应式当然是效率快和时间少。这样上司看见了也会觉得你能力不错，说不定哪天就给你涨薪资  ^__^ !

就像我做第二个站时，用的自适应，五天就把有着十个页面的网站写出来了。而且每一页的css都上了五百行。

而第一个站花了近一个月，这一个月里我更多的时间就是花在解决上面我说的三点bug上。

一、完成 基础配置搭建 手机端

参考链接https://www.cnblogs.com/bchjazh/articles/6076257.html

 1：域名解析并建站

 进入域名管理，建立A记录，解析至相应的IP地址，

 比如将“www.phpcms.com”解析至www的IP，在服务器中新建一个站

 如“m.phpcms.com”，（原网站如www.phpcms.com）将wap站的主目录只向与原网站一样，

 并将wap站的默认设为index.php,原网站设为index.html.

2：在PHPCMS V9管理后台添加手机门户

PHPCMS V9后台管理中心 > 模块 > 手机门户 > 添加手机站点

填写站点名称、LOGO、绑定域名，注意域名一定是http://开头的。

3：分类管理

在建好的手机门户列表管理操作中有一项“分类管理”，WAP的分类需要新建，

然后绑定对应的栏目，这种耦合方式比较好，也比较灵活。

4：更改route.php

文件路径 /caches/configs/route.php

在 return array 中增加两行代码
'm.phpcms.com'=>array('m'=>'wap', 'c'=>'index', 
'a'=>'init','data'=>array('GET'=>array('siteid'=>1))),
然后保存

5：在phpcms/templates/default/wap/index.html

修改模板，根据模板和第三步绑定的TYPEID 拿取和PC端一样的数据

如：

{pc:wap  action="position" posid="1" order="listorder DESC" num="6"}
  {loop $data $r}
    <li>
       <a href="{$r[url]}">{str_cut($r['title'],26,'')}</a>
       <img src="{thumb($r[thumb],1903,507)}" alt="" alt="{$r[title]}" /> 
    </li>
  {/loop}
{/pc}

 注：在手机端上url应为 {show_url($r[catid],$r[id],$typeid)} ，获取的才是带m的url

到这一步，只实现了手机端可以查看一个首页和list、show模板。

但是往往在业务中，我们往往会有多个list模板和show模板

二、如何绑定多个list模板和show模板

所以我参考了这位的链接 https://www.cnblogs.com/xyat/p/9947613.html 本 链接 由 襄阳艾特网络  http://www.xyat.cn 原创

让我完美实现了手机端和PC端共用一个数据的问题。 ，

他的思路就是修改PHP代码，使移动端的栏目和pc端的栏目绑定一样的模板，这里说绑定一样的模板指的是绑定同样的模板名字。

打开自己的PC端模板路径，

如果你pc端的栏目绑定模板规则如下：

图片栏目模板　　　　 category_picyure.html

图片列表模板               list_picture.html　　----->内容页模板  show_picture.html

那么移动端的绑定结果如下  \phpcms\templates\default\wap 

图片栏目模板　　　　 category_picyure.html

图片列表模板               list_picture.html　　----->内容页模板  show_picture.html

你只需要在移动端的模板里面添加相应的模板文件，移动端栏目就能自动绑定。

就算你不添加，到时候打开页面也会提示你模板不存在。

下面是具体的代码修改

1、因为移动端首页模板绑定的是wap\index.html，所以不做修改。

2、打开\phpcms\modules\wap\index.php

 在方法 lists 中，约47行

$template = ($TYPE[$typeid]['parentid']==0 && in_array($typeid,array_unique($parentids))) ? 
$WAP_SETTING['category_template'] : $WAP_SETTING['list_template'];

将其注释，然后添加代码

/*$template = ($TYPE[$typeid]['parentid']==0
 && in_array($typeid,array_unique($parentids))) ? 
$WAP_SETTING['category_template'] : $WAP_SETTING['list_template'];    */
        // 改造wap的默认模板  使其跟随pc模板规则走
        $setting = string2array($setting);
        $template = $setting['category_template'] ? $setting['category_template'] : 'category';
        $template_list = $setting['list_template'] ? $setting['list_template'] : 'list';
        $template = $child ? $template : $template_list;
        // 改造结束
        // 重新组装数据 让catgory的模板也能用
        if($child){
            $catids_str = $arrchildid;
            $pos = strpos($catids_str,',')+1;
            $catids_str = substr($catids_str, $pos);
            $sql = "status=99 AND catid IN ($catids_str)";
            $list = $this->db->select($sql, '*', $offset.','.$pagesize,'inputtime DESC');
            $total = $this->db->count($sql);
        }else{
            $list = $this->db->select(array('status'=>'99','catid'=>$catid), '*', $offset.','.$pagesize,'inputtime DESC');
        }
        //重新组装数据结束

　　这样category 和list 都绑定了相应的栏目模板。其中数据就是 $list。 你可以使用$list进行遍历。

3、打开\phpcms\modules\wap\index.php

　在方法 show中约206行 $template = $WAP_SETTING[‘show_template’] ? $WAP_SETTING[‘show_template’] : ‘show’; 将其注释

//$template = $WAP_SETTING['show_template'] ? $WAP_SETTING['show_template'] : 'show';
//处理模板调用
  $template = $CAT['setting']['show_template'] ? $CAT['setting']['show_template'] : 'show';

 ok 这样处理完成了！

三、如何绑定单页面

注：由于网站一般都带有单页页面，而且手机端的绑定栏目不能绑定单页，所以我想了一下，在添加栏目的时候我们就选择添加栏目。

在选择模板设置的时候，我把之前写在page_ai页面的代码复制到list_ai页面。

这样我们在手机门户的绑定栏目就可以看见了

最后在\phpcms\templates\default\wap下复制一份content的list_ui就OK了。

如下图：

手机端数据调用 ：  

字段：PC端调用 =>  手机端调用

url:{$v[url]}                                =>   {show_url($r[catid],$r[id],$typeid)}  

栏目id：catid （PC一级栏目id）=>   typeid （手机绑定栏目id ） 

导航：{catpos($catid)}              =>   {wap_pos($typeid)}

手机端详情页的上一篇和下一篇：

<p class="article-prev article-other">
    {pc:get sql="select * from lr_article where id>$id and catid=$catid order by id" num="1" return="data"}
        {if $data}
            {loop $data $v}
            <span>上一篇：<a href="{show_url($v[catid],$v[id],$typeid)}">{str_cut($v[title], 70,'')}</a></span>
            {/loop}
        {else}
            <span>上一篇：没有了</span>
        {/if}
    {/pc}
</p>
<p class="article-next article-other">
    {pc:get sql="select * from lr_article where id<$id and catid=$catid order by id desc" num="1" return="data"}
        {if $data}
            {loop $data $v}
            <span>下一篇：<a href="{show_url($v[catid],$v[id],$typeid)}">{str_cut($v[title], 70,'')}</a></span>
            {/loop}
        {else}
        <span>下一篇：没有了</span>
        {/if}
    {/pc}
</p>

最后一步，就是加一段代码，让网站自动根据手机端或者PC端跳转域名

<script>
            function IsPC() {
            var userAgentInfo = navigator.userAgent;
            var Agents = ["Android", "iPhone",
                        "SymbianOS", "Windows Phone",
                        "iPad", "iPod"];
            var flag = true;
            for (var v = 0; v < Agents.length; v++) {
                if (userAgentInfo.indexOf(Agents[v]) > 0) {
                    flag = false;
                    break;
                }
            }
            return flag;
        }
        if(!IsPC()){
            
        }else{
            window.location.href='PC端域名'
        }
        </script>