您现在的位置是:首页 > 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>
这样首页就算是完成了

本文标签:

很赞哦! ()

相关源码

  • 帝国cms大气淘宝客网站源码带手机版带火车头采集本款创意礼物导购网站模板为礼物类电商平台设计,采用清爽简约的界面风格,具备完善的商品导购功能。系统支持在文章攻略中灵活插入商品购买链接,实现内容与电商的结合。查看源码
  • (PC+WAP)家居装饰家装建材营销型网站pbootcms模板下载本模板基于PbootCMS开发,主要服务于家居装饰、建材及相关行业。采用现代化设计风格,同时适配PC和移动设备访问。模板结构清晰,突出展示家装案例和建材产品,帮助企业在线上建立专业形象,有效展示产品与服务优势。查看源码
  • (PC+WAP)五金机械设备营销型模板下载带在线留言为机械设备制造商设计的营销型模板,集成产品参数对比系统、产品展示模块和询价管理功能。采用PbootCMS开发内核,PHP7+运行环境。手工编写语义化HTML5结构,CSS3动画优化交互体验。查看源码
  • (自适应响应式)HTML5简繁双语电子元器件设备制造Pbootcms模板下载本模板为电子科技设备制造、电子元件生产等高科技企业设计,采用PbootCMS内核开发,具备简繁双语切换功能。模板设计充分考虑了电子科技行业的技术展示需求,能够专业呈现各类电子元器件、电路板、智能设备的参数规格和应用方案。查看源码
  • (自适应响应式)HTML5电脑手机电子数码产品配件pbootcms模板下载本模板为电脑配件、手机配件及数码周边产品企业设计,基于PbootCMS内核开发。采用现代化响应式布局,适配各类移动设备,能够专业展示各类电子产品配件参数、应用场景和技术特点。模板内置多种产品展示模块,满足不同类型配件企业的展示需求。查看源码
  • (自适应)摄像头安防电子设备pbootcms源码下载本模板基于PbootCMS系统开发,为安防电子设备企业设计,特别适合监控摄像头、安防系统等产品的展示。采用响应式技术,确保各类设备参数和功能在不同终端上都能清晰呈现。查看源码
分享笔记 (共有 篇笔记)
验证码:

本栏推荐