前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >ZblogPHP自动调用文章第一张图为缩略图及随机缩略图

ZblogPHP自动调用文章第一张图为缩略图及随机缩略图

作者头像
老蒋
发布2021-12-27 09:39:03
1.8K1
发布2021-12-27 09:39:03
举报
文章被收录于专栏:老蒋专栏老蒋专栏

一般情况,老蒋在帮助客户网站制作的时候关于产品缩略图的调用会使用ZblogPHP平台中"自定义字段插件"直接人工选择一个产品的图片作为展示前台的产品缩略图,这样的好处就是可以选择自己需要的或者自定义的产品、文章图片展示,唯一比较麻烦的是编辑和更新文章的时候都要手工输入图片的URL才可以。

我们其实也可以采用自动缩略图的方法,比如在内容中有图片的时候自动选择第一张图作为缩略图,我们可以在发布产品、文章的时候有意的把需要作为缩略图的图片放到第一张。且在没有图片的内容时候,我们可以随机调用准备好的几个图片作为随机展示,这样的案例在很多博客模板中都有见到。这里老蒋也把这个常用的代码记录下来,以后在制作主题模板时候可能会经常用到。

第一、可能需要用到的效果

这个演示是老蒋在制作一个博客主题时候侧栏以及内容列表时候用到的缩略图效果,这个我们应该很常见的。

第二、自动缩略图效果实现步骤

1、通用代码

代码语言:javascript
复制
{php}
$temp=mt_rand(1,5);
$pattern="/<[img|IMG].*?src=[\'|\"](.*?(?:[\.gif|\.jpg|\.png]))[\'|\"].*?[\/]?>/";
$content = $article->Content;
preg_match_all($pattern,$content,$matchContent);
if(isset($matchContent[1][0]))
$temp=$matchContent[1][0];
else
$temp=$zbp->host."zb_users/theme/$theme/style/images/random/$temp.png";
{/php}

如果没有图片,我们就从在当前主题的/style/images/random/文件夹中调用5个准备好的png图片,名称分别是1.png,2.png,3.png,4.png,5.png。且如果需要多个我们可以修改上面的参数。

PS:以上代码放到调用文章列表循环内。

2、调用位置

<img src="{$temp}" />

在调用图片的位置放上上面的调用,我们也可以给上面图片加上样式,比如设定固定的宽度和高度,以及用border-radius加上圆角,以及边框等效果。

总结,有这样的代码我们并不需要用到插件,就可以制作出丰富的图文ZblogPHP主题。

本文出处:老蒋部落 » ZblogPHP自动调用文章第一张图为缩略图及随机缩略图 | 欢迎分享

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016-01-29 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档