您现在的位置是:首页 > cms教程 > phpcms教程phpcms教程

phpcms后台管理首页内容替换方法

夏菡2025-06-12phpcms教程已有人查阅

导读接着上一篇随笔,头尾替换完成后,开始对首页主体内容进行替换,首先大图轮播替换:先到后台内容菜单下的管理栏目那里添加大图轮播栏目,选择不在导航显示:

接着上一篇随笔,头尾替换完成后,开始对首页主体内容进行替换,首先大图轮播替换:先到后台内容菜单下的管理栏目那里添加大图轮播栏目,选择不在导航显示:
然后在管理内容那里添加内容,把大图添加上:
依次添加几张都可以,方法一样。
回到Index页面,这里要用内容列表lists的代码(可以从phpcms标签中找):
{pc:content action="lists" catid="13" order="listorder ASC" num="4"}
{loop $data $key $val}
{/loop}
{/pc}
loop相当于循环,无论几张图只要循环一张就可以,我们把图片路径替换为thumb,catid的值从管理栏目中查看:
<div id="datu">
<div id="tu">
{pc:content action="lists" catid="13" order="listorder ASC" num="4"}
{loop $data $key $val}
<img class="lunbo" src="{$val[thumb]}" width="1200" height="642" />
{/loop}
{/pc}
<div id="prev"></div>
<div id="next"></div>
<div id="sy"></div>
</div>
</div>
这样大图轮播就替换完成了。
然后添加中间的部分:
回到后台在内容菜单下管理内容较新优惠处添加四个内容:
再回到Index页面,这部分分四个div,每个div样式都是相同的,这样便于循环,先看原来的代码:
<div id="youhuiwai">
<div id="yh_title">公司较新优惠</div>
<div id="youhui">
<div class="yh_item">
<div class="yh_img">
<a href="#"><img src="images/cpzhanshi.jpg" width="280" height="180" /></a>
</div>
<div class="yh_bt">
产品名称
</div>
<div class="yh_jj">
产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介
</div>
</div>
<div class="yh_item">
<div class="yh_img">
<a href="#"><img src="images/cpzhanshi.jpg" width="280" height="180" /></a>
</div>
<div class="yh_bt">
产品名称
</div>
<div class="yh_jj">
产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介
</div>
</div>
<div class="yh_item">
<div class="yh_img">
<a href="#"><img src="images/cpzhanshi.jpg" width="280" height="180" /></a>
</div>
<div class="yh_bt">
产品名称
</div>
<div class="yh_jj">
产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介
</div>
</div>
<div class="yh_item">
<div class="yh_img">
<a href="#"><img src="images/cpzhanshi.jpg" width="280" height="180" /></a>
</div>
<div class="yh_bt">
产品名称
</div>
<div class="yh_jj">
产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介产品简介
</div>
</div>
</div>
</div>
替换的时候只留一个,其他三个删除就可以,然后把大图轮播的代码放到这里来,循环就可以了:
<!--公司较新优惠-->
<div id="youhuiwai">
<div id="yh_title">公司较新优惠</div>
<div id="youhui">
{pc:content action="lists" catid="14" order="listorder ASC" num="4"}
{loop $data $key $val}
<div class="yh_item">
<div class="yh_img">
<a href="{$val[url]}"><img src="{$val[thumb]}" width="280" height="180" /></a>
</div>
<div class="yh_bt">
{$val[title]}<!--题目-->
</div>
<div class="yh_jj">
{$val[description]}<!--简介-->
</div>
</div>
{/loop}
{/pc}
</div>
</div>
之后是这一部分:
这一部分就是一个各个栏目的简介,我们看index页面,也是四个div样式相同:
<div id="gy_title">关于我们</div>
<div id="qitawai">
<div id="qita">
<div class="qt_list">
<div class="qt_title">
<span class="qt_t_us">关于我们</span>
<a href="#"><span class="qt_t_more">更多>></span></a>
</div>
<div class="qt_img_wai">
<a href="#"><img src="images/gywomen.jpg" width="280" height="269" /></a>
</div>
<div class="qt_nr">
代码号十多年来一直致力于美容院、化妆品、保健品领域的营销与策划,拥有专业的营销...
</div>
</div>
<div class="qt_list">
<div class="qt_title">
<span class="qt_t_us">新闻动态</span>
<a href="#"><span class="qt_t_more">更多>></span></a>
</div>
<div class="qt_img_wai">
<a href="#"><img src="images/xwdongtai.jpg" width="280" height="269" /></a>
</div>
<div class="qt_nr">
代码号十多年来一直致力于美容院、化妆品、保健品领域的营销与策划,拥有专业的营销...
</div>
</div>
<div class="qt_list">
<div class="qt_title">
<span class="qt_t_us">产品展示</span>
<a href="#"><span class="qt_t_more">更多>></span></a>
</div>
<div class="qt_img_wai">
<a href="#"><img src="images/cpzhanshi.jpg" width="280" height="269" /></a>
</div>
<div class="qt_nr">
代码号十多年来一直致力于美容院、化妆品、保健品领域的营销与策划,拥有专业的营销...
</div>
</div>
<div class="qt_list">
<div class="qt_title">
<span class="qt_t_us">联系我们</span>
<a href="#"><span class="qt_t_more">更多>></span></a>
</div>
<div class="qt_img_wai">
<a href="#"><img src="images/lxwomen.jpg" width="280" height="269" /></a>
</div>
<div class="qt_nr">
代码号十多年来一直致力于美容院、化妆品、保健品领域的营销与策划,拥有专业的营销...
</div>
</div>
</div>
</div>
我们依然是只循环一个就可以,其他三个删除,由于这些是属于从栏目中调取内容,所以需要在循环中嵌套一个循环:
<div id="gy_title">关于我们</div>
<div id="qitawai">
<div id="qita">
{pc:content action="category" catid="0" num="4" siteid="$siteid" order="listorder ASC"}
{loop $data $r}<!--内容栏目列表-->
<div class="qt_list">
<div class="qt_title">
<span class="qt_t_us">{$r[catname]}</span>
<a href="{$r[url]}"><span class="qt_t_more">更多>></span></a>
</div>
{pc:content action="lists" catid="$r[catid]" order="listorder ASC" num="1" moreifo="1"}
{loop $data $key $val}<!--内容数据列表-->
<div class="qt_img_wai">
<a href="{$val[url]}"><img src="{$val[thumb]}" width="280" height="269" /></a>
</div>
<div class="qt_nr">
{$val[description]}<!--简介-->
</div>
{/loop}
{/pc}
</div>
{/loop}
{/pc}
</div>
</div>
这样首页就算是完成了

本文标签:

很赞哦! ()

相关源码

  • (自适应响应式)投资理财金融机构财务管理pbootcms模板本模板基于PbootCMS系统开发,为投资理财、金融机构等行业设计。采用专业严谨的布局风格,突出金融服务行业特色,适合展示各类理财产品、投资服务和金融资讯。查看源码
  • 响应式茶叶茶道pbootcms网站模板源码(自适应手机端)棕色复古茶具主题的响应式网站模板,为茶叶茶道企业设计,同时支持古玩字画、艺术文化等行业的快速适配,通过替换文字图片即可转型为其他行业官网,大幅降低开发成本。查看源码
  • 自适应响应式绿色装修公司定制家居类pbootcms网站下载(自适应手机端)响应式全屋装修定制家居类网站pbootcms模板 绿色装修公司网站源码下载PbootCMS内核开发的网站模板,该模板适用于装修定制网站、装查看源码
  • (自适应)互联网建站网络公司个人工作室网站模板基于PbootCMS内核开发,围绕「技术方案展示」「成功案例库」「服务流程说明」三大模块构建,支持PC与移动端数据实时同步。附带包含客户评价、行业解决方案的完整测试数据包查看源码
  • (自适应响应式)黑色酷炫高端数码摄影pbootcms网站模板源码本模板基于PbootCMS开发,为摄影工作室、个人摄影师及摄影爱好者设计。采用深色系风格,突出摄影作品展示效果,适配各类数码设备浏览。适用于作品集展示查看源码
  • (自适应)五金配件机械加工设备pbootcms模板免费下载这款基于PbootCMS开发的网站模板为五金配件和机械加工行业设计,采用简洁有力的设计风格,突出工业产品的专业性和可靠性。模板结构清晰,功能完善,能够有效展示各类工业产品的技术参数和应用场景。查看源码
分享笔记 (共有 篇笔记)
验证码:

本栏推荐