首页 > 代码库 > php后台管理(列表页替换)

php后台管理(列表页替换)

列表页替换,首先把文件名前边加个前缀list,代表列表页:

技术分享

我们以list_news为例进行替换,先看一下替换前的页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>


<link href=http://www.mamicode.com/"css/news.css" rel="stylesheet" type="text/css" />


</head>

<body>


<!--内容开始-->

<div id="newsimgwai">
    <div id="newsimg">
        <img src=http://www.mamicode.com/"images/1.jpg" width="1200" height="290" />
    </div>
</div>

<div id="newsnrwai">
    <div id="newsnr">
        <div class="news_item">
            <div class="news_img">
                <a href=http://www.mamicode.com/"#"><img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" /></a>
            </div>
            <div class="news_nr">
                <a href=http://www.mamicode.com/"#"><div class="news_title">
                    什么东西吃得越多越苗条
                </div></a>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
        <div class="news_item">
            <div class="news_img">
                <img src=http://www.mamicode.com/"images/cpzhanshi.jpg" width="237" height="160" />
            </div>
            <div class="news_nr">
                <div class="news_title">
                    什么东西吃得越多越苗条
                </div>
                <div class="news_jj">
                    每种食品中蛋白质、脂肪、碳水化合物和水分的比例不同,吃进去之后给身体增加的能量数额也不同。 按照同样的重量来说,水分大的食物能量少,因为水是没有能量的;含油脂多的食...
                </div>
                <div class="news_sj">
                    2017-03-14
                </div>
            </div>
        </div>
        
    </div>
</div>
<!--分页-->
<div id="news_fenye">
    <div id="news_fy_nr">
    共 1页6条记录
    </div>
</div>

<!--内容结束-->

</body>
</html>

新闻中心添加内容:

技术分享

我们先从头尾开始替换,把头尾删除,把样式也替换掉:

{template "content","header"}
<link href=http://www.mamicode.com/"{CSS_PATH}css/news.css" rel="stylesheet" type="text/css" />
{template "content","footer"}

注意替换头尾时要把页面里的body和html删除,因为header.html页面已经有这两个标签了。

然后开始替换内容,先调取当前栏目图片:

<div id="newsimgwai">
    <div id="newsimg">
        <img src=http://www.mamicode.com/"{$CATEGORYS[$catid][image]}" width="1200" height="290" /><!--调取当前栏目图片-->
    </div>
</div>

跟其他的一样对内容进行循环,替换分页、题目、时间、简介:

<div id="newsnrwai">
    <div id="newsnr">
            {pc:content  action="lists" catid="$catid" order="listorder asc" num="4" moreinfo="1" page="$page"}<!--分页-->
            {loop $data $val}<!--循环开始-->
        <div class="news_item">
            <div class="news_img">
                <a href=http://www.mamicode.com/"{$val[url]}"><img src=http://www.mamicode.com/"{$val[thumb]}" width="237" height="160" /></a><!--thumb缩略图路径-->
            </div>
            <div class="news_nr">
                <a href=http://www.mamicode.com/"{$val[url]}"><div class="news_title">
                    {$val[title]}<!--题目-->
                </div></a>
                <div class="news_jj">
                    {$val[description]}<!--简介-->
                </div>
                <div class="news_sj">
                    {date(Y-m-d,$val[inputtime])}<!--时间格式替换-->
                </div>
            </div>
        </div>
        {/loop}
        {/pc}
        
    </div>
</div>

最后分页替换很简单写一个{$pages}:

<!--分页-->
<div id="news_fenye">
    <div id="news_fy_nr">
    {$pages}<!--分页-->
    </div>
</div>

<!--内容结束-->
{template "content","footer"}

这样list_news就替换完成了。

最终效果:

技术分享

 

php后台管理(列表页替换)