极致CMS列表页如何获取文章中的图片和图片数量?

有时候我们看到其他的博客网站上面,它的列表页里可以展示文章的图片和数量,如下图:

1.jpg

这样看起来就比较美观,不再是单一的缩略图。这是怎么做到的呢?这个是效果:

2.jpg

以下是极致CMS获取文章图片和图片数量的教程。

第一步  获取文章图片

请将以下代码粘贴到列表页所需要的位置中,

{foreach $lists as $v}
   <!-- 获取文章是否有图片 -->
   {php
   $pattern='/<img.*?src="(.*?)".*?>/is';
   $r = preg_match_all($pattern,$v['body'],$imgslist);
   /}
     {if($r)}
     <!--内容有图片输出这里-->
        {foreach $imgslist[1] as $img}
            <img src="{$img}" alt="{$v['title']}"/>
        {/foreach}
     {else}
     <!--内容无图片输出这里-->
     {/if}
{/foreach}

有图就显示,没有图就不显示。样式自己再调整。

第二步  获取图片图片数量

请将以下代码粘贴到列表页所需要的位置中。

{fun substr_count($v[body],'<img')}

样式自己调整。

引申

如何做成文章列表无图、单图和只显示4张图?

前提:当文章里有图时,极致CMS会抽取文章里的第一张图作为缩略图。

1、文章里有图,文章里的图小于3张,则只显示单图,即1张;

2、文章里有图,且文章里的图大于等于4张,则显示为4张;

3、文章里无图,且没有缩略图,则不显示图片。

以下为实现代码:

{foreach $lists as $v}
   <!-- 有缩略图则输出这里 -->
   {if($v['litpic'])}
       <!-- 获取文章中的图片数量 -->
       {php $pics_num = substr_count($v[body],'<img')/}
      {if($pics_num < 3)}
          <!-- 文章中的图片小于3张则输出这里 -->
      {else}
      <!-- 文章中图片大于3张则输出这里 -->
          {php
          $pattern='/<img.*?src="(.*?)".*?>/is';
          $r = preg_match_all($pattern,$v['body'],$imgslist);
          /}
             {if($r)}
                {php $i=1;/}
                   {foreach $imgslist[1] as $img}
                  {if($i < 4)}
                  <!-- 输出4张图则写4,输出5张图则写5 -->
                          <li><img src="{$img}" alt="{$v['title']}"></li>
                      {/if}
            {php $i++;/}
                   {/foreach}
             {/if}  
      {/if}
   {else}
   <!-- 无缩略图则输出这里 -->
   {/if}
{/foreach}



返回顶部