本文转自:http://www.cnblogs.com/huige728/archive/2012/06/13/2548089.html
这里讲的和header.php(1)中差不多,可以看看,好了,下面我说说怎么弄吧。
第一,我们要在后台新建模块(太简单了我就不说怎么建了,呵呵),这里我们就建一个footer的模块。
第二,在footer.php文件中载入我们的刚刚建好的模块
1
2
3
4
5
6
7
8
9
|
<div
class
=
"layout grid-m"
>
<div
class
=
"foot_modules J_TRegion"
>
<?php
$foot_modules
=
array
(
array
(
'id'
=>
'footer'
, domId =>
"footer_01"
),
// 950页面底部模块,这里也可以做个通栏效果,在上篇中讲了
);
echo
include_modules(
'foot_modules'
,
$foot_modules
);
//引号里是坑名,后面是变量名
?>
</div>
</div>
|
第三,写好模块的结构(这里结构比较简单,很清晰,我就直接嵌套php代码了,呵呵,偷懒下,这里是直接文本输出的,没有循环什么的东西,很简单)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<div
class
=
"box J_TBox"
<?php
echo
$_MODULE_TOOLBAR
?>>
<div
class
=
"footer"
>
<div
class
=
"footer01"
>
<ul>
<li
class
=
"ab"
>
<strong><a href=
"<? echo $_MODULE['link_1'];?>"
target=
"_blank"
><?
echo
$_MODULE
[
'text_1'
];?></a></strong>
<p><?
echo
$_MODULE
[
'desc_1'
];?></p>
</li>
<li
class
=
"ac"
>
<strong><a href=
"<? echo $_MODULE['link_2'];?>"
target=
"_blank"
><?
echo
$_MODULE
[
'text_2'
];?></a></strong>
<p><?
echo
$_MODULE
[
'desc_2'
];?></p>
</li>
<li
class
=
"ad"
>
<strong><a href=
"<? echo $_MODULE['link_3'];?>"
target=
"_blank"
><?
echo
$_MODULE
[
'text_3'
];?></a></strong>
<p><?
echo
$_MODULE
[
'desc_3'
];?></p>
</li>
</ul>
</div>
</div>
</div>
|
第四,结构弄好了,我们就要去写下,我们要的功能了,打开module.xml文件。
<?xml version="1.0" encoding="GBK" standalone="yes"?> <module xsi:noNamespaceSchemaLocation="http://www.cnblogs.com/../module.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> <id>footer</id> <name>脚部</name> <file>footer.php</file> <thumbnail>assets/images/index.png</thumbnail> <description>页面底部模块,可自定义文字内容</description> <requiredCache>true</requiredCache> <parameters> <param label="链接1┏" formType="text" readonly="false" description="┓链接1" ptype="text" name="link_1"> http://www.taobao.com </param> <param label="标题1┣" formType="text" readonly="false" description="┫标题1" ptype="text" name="text_1"> 温馨提示 </param> <param label="描述1┗" formType="text" readonly="false" description="┛描述1" ptype="text" name="desc_1"> 购买后如发现质量问题,请及时反馈,不要直接差评,否则不予任何售后服务。 </param> <param label="链接1┏" formType="text" readonly="false" description="┓链接1" ptype="text" name="link_2"> http://www.taobao.com </param> <param label="标题1┣" formType="text" readonly="false" description="┫标题1" ptype="text" name="text_2"> 关于色差 </param> <param label="描述1┗" formType="text" readonly="false" description="┛描述1" ptype="text" name="desc_2"> 所有宝贝均为实物拍摄,因显示器不用显示不同,对色彩要求高的情慎拍。 </param> <param label="链接1┏" formType="text" readonly="false" description="┓链接1" ptype="text" name="link_3"> http://www.taobao.com </param> <param label="标题1┣" formType="text" readonly="false" description="┫标题1" ptype="text" name="text_3"> 关于退换货 </param> <param label="描述1┗" formType="text" readonly="false" description="┛描述1" ptype="text" name="desc_3"> 请您在收到商品后,咨询检查,确认没有问题后签收,如质量问题,本店承担运费调换。 </param> </parameters> </module>
弄好了后,我们当然也不能少了css这个样式啊,不然不漂亮。
/*脚部内容*/ .footer{width:950px;} .footer01{width:928px;padding:10px;border:#e6e6e6 solid 1px;border-top:#ff8808 solid 4px;margin-top:10px;clear:both;text-align:left;} .footer01 ul{height:70px;} .footer01 ul li.ab{float:left;background:url(../images/footer/foot.gif) no-repeat left top;width:250px;height:60px;padding-left:58px;} .footer01 ul li.ac{float:left;background:url(../images/footer/foot.gif) no-repeat left -90px;width:250px;height:60px;padding-left:58px;} .footer01 ul li.ad{float:left;background:url(../images/footer/foot.gif) no-repeat left -180px;width:250px;height:60px;padding-left:58px;}
这样,我们就大功告成了,最后我们看看效果图吧
还不错吧,对了还要补上我们用的的素材图片