接上文 给博客添加一个“玻璃框”,让其显得更加的立体 之后继续折腾还没折腾完的项目——缩(猥 )微( 琐)图。
折腾开始
现在百度找了以下教程
function thumb($cid) {if (empty($imgurl)) {
$rand_num = 10; // 随机图片数量,根据图片目录中图片实际数量设置
if ($rand_num == 0) {
$imgurl = " 随机图片存放目录 /0.jpg";
// 如果 $rand_num = 0, 则显示默认图片,须命名为 "0.jpg",注意是绝对地址
}else{$imgurl = " 随机图片存放目录 /".rand(1,$rand_num).".jpg";
// 随机图片,须按 "1.jpg","2.jpg","3.jpg"... 的顺序命名,注意是绝对地址
}
}
$db = Typecho_Db::get();
$rs = $db->fetchRow($db->select('table.contents.text')
->from('table.contents')
->where('table.contents.type = ?', 'attachment')
->where('table.contents.parent= ?', $cid)
->order('table.contents.cid', Typecho_Db::SORT_ASC)
->limit(1));
$img = unserialize($rs['text']);
if (empty($img)){echo $imgurl;}
else{echo '你的博客地址'.$img['path'];
}
}
以上代码放入 Functions.php
文件中。
然后在想在调用的文件里放入以下代码,这里我放入的是首页位置。
<?php echo thumb($this->cid); ?>
结果显示的并不是图片,而是图片的链接地址
既然只显示链接没有显示图片,那直接由图片代码把链接包住不就可以了吗,于是把第二段代码改成
<img src="<?php echo thumb($this->cid); ?>">
但是新问题又出来了:
1. 图片高度不统一;
2. 图片左右不对称;
3. 图片直角不好看,和主题不搭,于是继续改第二段代码
<img style="margin:0;height:300px;width:100%;max-height:50%;" src="<?php echo thumb($this->cid); ?>">
然后在图片的 CSS 部分加入圆角 border-radius:20px;
搞定!
感谢
1. 感谢源代码提供者: 老蒋部落
2. 感谢大佬的耐心指导:JDEAL
遗留问题(完美解决)
由于本博客的图片一部分是本地上传,一部分是新浪图库,所以出现了一个问题。
要么显示了图库的图片就不能显示本地图片,要么显示了本地图片就不能显示图库图片,鱼和熊掌不可兼得呀,遗憾!
胡思乱想,有没有这样的一种代码:如果是 A 显示 A 如果不是 A 显示 B,如果不是 B 显示 C 哈哈
异想天开!
2019.6.26 更新
由于上述方法只能调用本地图片和随机图片,不能调用外链图片,所有又在百度继续找,于是在 QQ 爹 那里找到了完美的解决的方法,方法如下:
/** 输出文章缩略图 */
function showThumbnail($widget)
{
// 当文章无图片时的默认缩略图
$rand = rand(1,99); // 随机 1-99 张缩略图
$random = $widget->widget('Widget_Options')->themeUrl . '/img/sj/' . $rand . '.jpg'; // 随机缩略图路径
// $random = $widget->widget('Widget_Options')->themeUrl . '/img/mr.jpg'; // 若只想要一张默认缩略图请删除本行开头的 "//", 需要在 img 文件夹下放个 mr.jpg 图片
$attach = $widget->attachments(1)->attachment;
$pattern = '/\<img.*?src\=\"(.*?)\"[^>]*>/i';
if (preg_match_all($pattern, $widget->content, $thumbUrl)) {echo $thumbUrl[1][0];
} else if ($attach->isImage) {echo $attach->url;}
else
if ($widget->tags) {foreach ($widget->tags as $tag) {if($tag['slug']==daima||$tag['slug']==anzhuo){//if 语句判断标签缩略名,如果是则输出下面文件夹内的图片
$a= $widget->widget('Widget_Options')->themeUrl . '/img/tag/' . $tag['slug'] . '.jpg';
echo $a;
}else {echo $random;// 没有匹配的标签图片,则随机输出图片}
break;
}
} else {echo $random;}
}
模板中需要添加缩略图地址的地方添加
<img src="<?php showThumbnail($this); ?>">
在你主题文件里的css文件里面,你搜索.img{}在大括号里
老狮 2019-08-26
试了我没放css,自适应了,但是手机打开的话图片好大,而且图片还是伸缩的,高度太高,有什么办法解决
Marchen 2019-08-27
你修改<img style="margin:0;height:300px;width:100%;max-height:50%;" src="<?php echo thumb($this->cid); ?>">这段代码里的height和max-height的数值
老狮 2019-08-27
你会把随机图片路径改成对象存储的路径吗
Marchen 2019-08-27
缩略图是自适应的嘛,不然手机打开还是很大
Marchen 2019-08-26
是自适应的
老狮 2019-08-26
那我试试,border-radius:20px;放去哪没懂
Marchen 2019-08-26