您当前的位置:首页 > 网络教程 > 帝国CMS教程

帝国cms 首页或者列表页 实现图文不同样式调用方法

如图,要实现上图效果,我采用如下方法:

1、首先在数据库模型,增加字段,分别是图片2,图片3

2、增加标签模板,用if,else if 来判断,输出

思路已打开,样式调用就可以多样化啦!

列表内容模板(list.var) (*)

$titlepic='';

$titlepic2='';

$titlepic3='';

if($r[titlepic] and $r[titlepic2] and $r[titlepic3])

{

$titlepic='<img src="[!--titlepic--]" /><img src="[!--titlepic2--]" /><img src="[!--titlepic3--]" /></a>';

}

else if($r[titlepic])

{

$titlepic='<span class="blogpic" ><a href="[!--titleurl--]" title="[!--oldtitle--]"><img src="[!--titlepic--]" alt="[!--oldtitle--]" /></a></span>';

}

$listtemp='

<li>

<div class="bloginfo">'.$titlepic.'

<p>[!--smalltext--]...</p>

</div>

</li>

';

那如果要更换标题位置怎么办?,再加一个titlepic为空的判断,这样无图情况下的标题就能调用出来了

代码如下:

$titlepic='';

$titlepic2='';

$titlepic3='';

$bigpic='';

if($r[titlepic] and $r[titlepic2] and $r[titlepic3])

{

$titlepic='

<h3 class="blogtitle"><a href="[!--titleurl--]" target="_blank" >[!--title--]</a></h3>

<span class="bplist"><a href="[!--titleurl--]" title="[!--oldtitle--]">

<li><img src="[!--titlepic--]" alt="[!--oldtitle--]"></li>

<li><img src="[!--titlepic2--]" alt="[!--oldtitle--]"></li>

<li><img src="[!--titlepic3--]" alt="[!--oldtitle--]"></li>

</a></span>';

}

else if($r[bigpic])

{

$titlepic='

<span class="bigpic"><a href="[!--titleurl--]" title="[!--oldtitle--]"><img src="[!--bigpic--]" alt="[!--oldtitle--]"></a></span>

<h3 class="blogtitle"><a href="[!--titleurl--]" target="_blank" >[!--title--]</a></h3>

';

}

else if($r[titlepic])

{

$titlepic='

<h3 class="blogtitle"><a href="[!--titleurl--]" target="_blank" >[!--title--]</a></h3>

<span class="blogpic"><a href="[!--titleurl--]" title="[!--oldtitle--]"><img src="[!--titlepic--]" alt="[!--oldtitle--]"></a></span>

';

}

else if(empty($r[titlepic]))

{

$titlepic='

<h3 class="blogtitle"><a href="[!--titleurl--]" target="_blank" >[!--title--]</a></h3>

';

}

$listtemp=' 

<div class="blogs" data-scroll-reveal="enter bottom over 1s" >    

'.$titlepic.'

<p class="blogtext">[!--smalltext--]... </p>

<div class="bloginfo">

<ul>

<li class="author">[!--writer--]</li>

<li class="lmname"><a href="[!--this.classlink--]"  target="_blank" >[!--this.classname--]</a></li>

<li class="timer">[!--newstime--]</li>

<li class="view"><span>[!--onclick--]</span>已阅读</li>

<li class="like">[!--diggtop--]</li>

</ul>

</div>

</div>

';

你觉得文章内容怎么样

阿里云代金券 100 云产品通用

有效期30天 首购用户

立即领取
阿里云代金券 100 云产品通用

有效期30天 复购+升级

立即领取