上篇博客中讲到了该修改网页的中间部分

中间的内容是这样的,有标题和内容,里面的内容被代码替代,运行起来就这样的

里面的内容就可以在后台管理那里添加

再来看代码部分

<div class="dt-double" style="left: 18.5%;">
<!--标题-->
<div class="dt-title">
<span class="dt-sp1">行业动态</span>
<a href="{$CATEGORYS[14]['url']}"><span class="dt-sp2" style="color: white;">更多>></span></a>
</div>
<!--展示项-->
{pc:content action="lists" catid="14" order="id DESC" num="4"}
{loop $data $val}
<div class="dt-item">
<a href="{$val[url]}">
<div class="dt-item-title">{$val[title]}</div>
</a>
<div class="dt-item-context">
{$val[description]}
</div>
</div>
{/loop}
{/pc}
</div>

这是行业动态的,资料库和行业动态一样,改个catid根据phpcms后台管理的id来写

 <!--资料库-->
<div class="dt-double" style="right: 18.5%;"> <!--标题-->
<div class="dt-title">
<span class="dt-sp1">汉企一一资料库</span>
<a href="{$CATEGORYS[8]['url']}"><span class="dt-sp2" style="color: white;">更多>></span></a>
</div>
<!--展示项-->
{pc:content action="lists" catid="8" order="id DESC" num="4"}
{loop $data $val}
<div class="dt-item">
<a href="{$val[url]}">
<div class="dt-item-title">{$val[title]}</div>
</a>
<div class="dt-item-context">
{$val[description]}
</div>
</div>
{/loop}
{/pc} </div>

然后从后台管理修改试试

在后台中加了这两项

更新缓存,看一下站点首页

从后台添加的内容已在首页显示

再给资料库加内容

更新缓存看一下首页

资料库的内容也被添加上

再来操作这方面的内容

先在header页面改个数

原先是5,现在改成6

然后在后台多加一栏目

然后再往里面添加上三项内容先

然后再来看代码部分

先审查元素,找到其中的一项内容,保留一项的代码,其他的都删掉

 <!--优秀产品展示  开始-->
<div class="yxxm">
<div class="yxxm-title">优秀产品展示</div>
<!--展示项-->
{pc:content action="lists" catid="16" order="id DESC" num="6" moreinfo="1"}
{loop $data $val}
<div class="yxxm-item">
<a href="{$val['url']}">
<img src="{$val['thumb']}" /></a>
<div class="yxxm-name">
项目名称:
<span>{$val['title']}</span>
</div>
<div class="yxxm-user">
客  户:
<span>{$val['keywords']}</span>
</div>
<div class="yxxm-context">
功  能:
<span style="width: 77%;">{$val['description']}</span>
</div>
<div class="yxxm-context">
开发人员:
<span>
{php list($copyfrom) = explode('|', $val['copyfrom'])}
{$copyfrom}</span>
</div>
</div> {/loop}
{/pc}
<!--占位勿删-->
<div style="clear: both"></div>
</div>
<!--优秀产品展示 结束-->

刷新页面

这样刚改的内容就显示在了首页上

接下来是公司承接

和上面的操作一样,只保留一个,然后更改代码

     <!--公司业务承接 开始-->
        <div class="yw">
            <div class="yw-title">公司业务承接</div>
            <div class="yw-items">
                {pc:content  action="lists" catid="13" order="id DESC" num="8" moreinfo="1"}
                 {loop $data $val}
                
                <div class="yw-item">
                    <img src="{$val['thumb']}" />
                    <div class="yw-item-title">
                    {php list($copyfrom) = explode('|', $val['copyfrom'])}
                    {$copyfrom}
                    </div>
                    <div class="yw-item-context">
                        {$val['description']}
                    </div>
                    <div class="yw-item-price">
                        <span class="price-sp">{$val['title']}</span>
                        <span class="price-sp1">价格:
                            <span class="price-sp2">{$val['keywords']}</span>
                            元</span>
                    </div>
                    <a href="{$val['url']}"><input class="btn_buy" type="button" value="点击订购" /></a>
                </div>
                {/loop}
            {/pc}
               
            </div>
            <img src="{IMG_PATH}/images/bk2.png" />
        </div>
        <!--公司业务承接 结束-->

然后给承接栏目添加内容

更新缓存,然后查看首页

下一项是人才

和上面的承接产品一样

 <!--优秀人才推荐 开始-->
        <div class="rc">
            <div class="rc-title">优秀人才推荐</div>             <div class="rc-items">
                <!--人才项-->
                {pc:content  action="lists" catid="11" order="id DESC" num="8" moreinfo="1"}
                 {loop $data $val}
                <div class="rc-item">
                    <a href="{$val['url']}">
                        <img src="{$val['thumb']}" />
                        <div class="rc-item-title">{$val['title']}</div>
                    </a>
                    <div class="rc-item-context">{$val['description']}</div>
                </div>
                {/loop}
            {/pc}
                <!--占位勿删-->
                <div style="clear: both"></div>
            </div>
        </div>
        <!--优秀人才推荐 结束-->

然后在后台管理那里添加内容,运行后

操作 成功

加上上篇博客,这样首页就已经替换完了,由静态页面变成动态页面了

再做它的子页面

在静态页面中,它的子页面应该是这个

在静态页面中是这个文件

现在把它复制到phpcms里面,和index路径一样

还要改一下文件名,如果是内容页,名字是list

然后再打开站点首页,点击导航栏就会打到子网页

是这个样子的

打开list文件,把头部分的代码删掉,引入header文件,如图

再把页脚部分代码替换一下

再来运行看一下

头部有了

页脚也有了

然后图片替换,只有一个

刷新运行一下

导航栏的背景图就出来了

但是还缺样式

在list代码中,再加上一个list样式

这样样式就出来了

再来替换里面的内容

把一侧的内容,替换成导航栏

 <!--二级导航 开始-->
<div class="left">
<div style="width: 100%; height: 50px; text-align: center; line-height: 50px; font-size: 18px; font-weight: bold;">导航</div> <a href="{siteurl($siteid)}">
<div class="left-item">首页</div>
</a>
{pc:content action="category" catid="0" order="listorder ASC" num="10" siteid="$siteid"} {loop $data $v}
{if $catid==$v[catid] || $top_parentid==$v[catid]}<!--判断显示的catid,如果是显示的catid-->
<a href="{$v[url]}"><div class="left-item xuanzhong">{$v[catname]}</div></a>
{else}
<a href="{$v[url]}"><div class="left-item">{$v[catname]}</div></a>
{/if} {/loop}
{/pc} </div>
<!--二级导航 结束-->

运行一下

操作成功

 <!--列表区 开始-->
<div class="right">
<div class="list-title">&nbsp;&nbsp;&nbsp;&nbsp;{$CATEGORYS[$catid][catname]}列表</div>

点测导航栏的人才

上面的导航栏会有选中的状态

点击侧导航承接,列表名,会出现对应的名字

再来替换一下列表项的内容

 <!--列表项-->

            {pc:content  action="lists" catid="$catid" order="id DESC" num="10" page="$page"}
{loop $data $val}
<div class="right-item">
<a href="{$val['url']}">
<div class="item-context">{$val['title']}</div>
</a>
<div class="item-time">{date('Y-m-d H:i:s',$val[inputtime])}</div>
</div>
{/loop}
{/pc}

运行一下

运行成功

这个页面还有一个友情链接,把友情链接替换一下

在后台管理中

这里可以添加友情链接,可以添加几个

然后代码部分再改一下

  <!--友情链接 分割区-->
<div style="width: 100%; height: 40px; line-height: 40px; text-align: center; background-color: #e0e0e0;">
友情链接:
{pc:link action="type_list" typeid="0" siteid="1" linktype="0" order="listorder DESC" num="4" return="pic_link"}<!---linktype="0" 是文字连接,linktype="1" 是logo链接-->
{loop $pic_link $v}
<a href="{$v['url']}">{$v['name']}</a>&nbsp;&nbsp;
{/loop}
{/pc} </div>

运行后

后台的模块友情链接一共有四个,其中这两个是文字链接,其他两个是logo链接,设置的是显示文字连接,所以出来的是这两个

这样友情链接也操作完成了

用phpcms如何将静态页面制作成企业网站(中)的更多相关文章

  1. 用phpcms如何将静态页面制作成企业网站,头部加尾部

    首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...

  2. 用phpcms如何将静态页面制作成企业网站(上)

    首先,先要准备好这个静态网页的源文件,如图 bs里面是一些css和js的文件,img则是放图片的,文件中的index是网页的首页 运行一下,看看 是这样的 然后打开phpcms文件,上篇博客中有提到, ...

  3. 用phpcms如何将静态页面制作成企业网站(下)

    上篇讲到了子页部分 这样的 有分页选择 列表项的代码部分 最后输出变量pages就可以了 看一下运行的效果 点击下一页 再来改一下子页显示的样式 点击人才将会出来的一个子页面 路径要统一 再来更改后台 ...

  4. 通过a标签在页面上显示视频网站中的视频

    1.把视频传到优酷.腾讯等视频网站中 <!DOCTYPE html> <html> <head lang="en"> <meta char ...

  5. (转载)ecshop制作成手机网站的方法

    ecshop用手机访问的时候,会自动跳转到  /mobile 目录下,ecshop自带的wap模板是用wml制作的,如果按这种情况,又需要制作一套模板,太麻烦,现在都是智能手机时代,wml模板已经不能 ...

  6. 浅谈php生成静态页面

    一.引 言 在速度上,静态页面要比动态页面的比方php快很多,这是毫无疑问的,但是由于静态页面的灵活性较差,如果不借助数据库或其他的设备保存相关信息的话,整体的管理上比较繁琐,比方修改编辑.比方阅读权 ...

  7. 静态页面如何实现 include 引入公用代码

    一直以来,我司的前端都是用 php 的 include 函数来实现引入 header .footer 这些公用代码的,就像下面这样: <!-- index.php --> <!DOC ...

  8. 【京东个人中心】——Nodejs/Ajax/HTML5/Mysql爬坑之静态页面

    一.引言 接着上一篇,京东个人中心的所有功能数据分析完成之后,现在需要把静态页面完成,实现过程中要用到的技术有:Bootstrap.html5表单新特性等.除此之外,还要利用Node.js的Expre ...

  9. 使用Git Bash远程添加分支和简单部署你的静态页面

    新建一个分支:git branch mybranch(mybranch你的分支名字) 切换到你的新分支: git checkout mybranch 将新分支发布在github上: git push ...

随机推荐

  1. ANSI标准

    NSI:美国国家标准学会(AMERICAN NATIONAL STANDARDS INSTITUTE: ANSI)成立于1918年.当时,美国的许多企业和专业技术团体,已开始了标准化工作,但因彼此间没 ...

  2. sqlserver 批量删除相同前缀名的表

    ) DECLARE tmpCur CURSOR FOR SELECT name FROM sys.objects WHERE TYPE='U' AND name LIKE N'HSUPA%' OPEN ...

  3. Unity3D ——强大的跨平台3D游戏开发工具(三)

    第四章 为地形添加水源.水流以及水下的模糊效果 制作好了地形的各种效果,接下来我们给场景添加一些水效果,使场景更加丰富. 第一步:添加水面 由于我在上一次的地形创作中就已经在山峰之间制作了一块洼地,它 ...

  4. Python爬虫框架Scrapy安装使用步骤

    一.爬虫框架Scarpy简介Scrapy 是一个快速的高层次的屏幕抓取和网页爬虫框架,爬取网站,从网站页面得到结构化的数据,它有着广泛的用途,从数据挖掘到监测和自动测试,Scrapy完全用Python ...

  5. CSS border三角、圆角图形生成技术简介

    http://www.zhangxinxu.com/wordpress/?p=794 一.前言 利用CSS的border属性可以生成一些图形,例如三角或是圆角.纯粹的CSS2的内容,没有兼容性的问题, ...

  6. jquery textarea输入字符字数提示

    效果: html代码: <textarea id="assayInfo" name="assayInfo" rows="3" cols ...

  7. Spark中的键值对操作-scala

    1.PairRDD介绍     Spark为包含键值对类型的RDD提供了一些专有的操作.这些RDD被称为PairRDD.PairRDD提供了并行操作各个键或跨节点重新进行数据分组的操作接口.例如,Pa ...

  8. php调用js变量

    <script> function tuichu(skp){ <?php $ok="skp"; echo "alert($ok)";//实验代 ...

  9. iOS 之 内存管理

    凡是alloc copy mutablecopy init 声明的变量,都需要通过手动的方式进行释放,realse. 如果 copy一个对象,则拥有了拷贝的对象,要负责释放. 如果 保持(retain ...

  10. C语言的指针使用

    今天老师总结了一下指针内容,感觉对理解指针有帮助, 1.大家在使用指针的时候容易忽略掉指针所在的位置.  假如定义一个变量int a=10: int *p: p=&a;    //p中存放变量 ...