Wordpress模板重写了文章列表的缩略图显示方式,把缩略图的质量压缩得很低,50多K的图片压缩只有只有9K,特别糊,因为还是想让文章列表的图片清晰一些,自己控制好图片的大小再上传就行,于是,尝试研究起相关的代码:
核心的代码在 /inc/core.de.php 里面:
if( !defined( 'THEME_THUMBNAIL_PATH' ) ) define( 'THEME_THUMBNAIL_PATH', '/cache/theme-thumbnail' ); //存储目录
function biji_build_empty_index( $path ){ //生成空白首页
$index = $path . '/index.php';
if( is_file( $index ) ) return;
wp_mkdir_p( $path );
file_put_contents( $index, "<?php\n// Silence is golden.\n" );
}
function biji_crop_thumbnail( $url, $width, $height = null ){ //裁剪图片
$width = (int) $width;
$height = empty( $height ) ? $width : (int) $height;
$hash = md5( $url );
$file_path = constant( 'WP_CONTENT_DIR' ) . constant( 'THEME_THUMBNAIL_PATH' ) . "/$hash-$width-$height.jpg";
$file_url = content_url( constant( 'THEME_THUMBNAIL_PATH' ) . "/$hash-$width-$height.jpg" );
if( is_file( $file_path ) ) return $file_url;
$editor = wp_get_image_editor( $url );
if( is_wp_error( $editor ) ) return $url;
$size = $editor->get_size();
$dims = image_resize_dimensions( $size['width'], $size['height'], $width, $height, true );
//if( !$dims ) return $url;
//$cmp = min( $size['width'] / $width, $size['height'] / $height );
//if( is_wp_error( $editor->crop( $dims[2], $dims[3], $width * $cmp, $height * $cmp, $width, $height ) ) ) return $url;
biji_build_empty_index( constant( 'WP_CONTENT_DIR' ) . constant( 'THEME_THUMBNAIL_PATH' ) );
return is_wp_error( $editor->save( $file_path, 'image/jpg' ) ) ? $url : $file_url;
}
//缩略图获取post_thumbnail
/*function post_thumbnail($width = 275,$height = 170)
{
global $post;
if( has_post_thumbnail( $post->ID ) ){
$thumbnail_ID = get_post_thumbnail_id( $post->ID );
$thumbnailsrc = wp_get_attachment_image_src( $thumbnail_ID, 'full' );
if( $width == 0 && $height == 0 ) return $thumbnailsrc[0];
else return biji_crop_thumbnail($thumbnailsrc[0],$width,$height);
} else {
$content = $post->post_content;
preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, PREG_PATTERN_ORDER);
if(count($strResult[1]) > 0){
if( $width == 0 && $height == 0 ) return $strResult[1][0];
else return biji_crop_thumbnail($strResult[1][0],$width,$height);
} else return false;
}
}*/
我自己虽然也懂一些编程,但毕竟不是程序员出身,研究了好久也没有完全研究明白,然后突然想到,为啥不用ChatGPT来协助呢,于是,我把这段代码贴到ChatGPT,先让它解释一下生成缩略图的原理是什么,收到这样的答案:
这段代码是用于在 WordPress 主题中生成缩略图的功能。代码的核心原理如下:
首先定义了一个常量 THEME_THUMBNAIL_PATH,表示缩略图的存储目录路径。
biji_build_empty_index 函数用于生成空白的 index.php 文件,用于保护存储目录的安全性。
biji_crop_thumbnail 函数用于裁剪图片生成缩略图。它接收图片的 URL、宽度和高度作为参数。函数内部会检查是否已存在相同尺寸的缩略图,如果存在则直接返回缩略图的 URL。否则,它会获取原始图片的编辑器对象,计算裁剪尺寸,并执行裁剪操作。最终,它会将裁剪后的图片保存到指定的存储目录,并返回缩略图的 URL。
post_thumbnail 函数用于获取文章的缩略图。它首先检查是否有特色图片,如果有则直接使用特色图片。如果没有特色图片,它会从文章内容中提取第一个图片标签的 URL,并使用 biji_crop_thumbnail 函数生成相应尺寸的缩略图。
综合来看,这段代码通过对原始图片进行裁剪,生成并存储不同尺寸的缩略图,以提高 WordPress 主题中的图片加载效率和页面加载速度。
然后,我又问:如果不允许这段代码进行图片裁剪,缩略图保持原图片尺寸和大小,应该如何修改?于是,ChatGPT直接给出了修改方法:
在
biji_crop_thumbnail
函数中,你可以将裁剪的部分代码注释掉,以保持尺寸一致:function biji_crop_thumbnail($url, $width, $height = null) { // ... 其他代码 ... // 注释掉裁剪的代码 // $cmp = min($size['width'] / $width, $size['height'] / $height); // if (is_wp_error($editor->crop($dims[2], $dims[3], $width * $cmp, $height * $cmp, $width, $height))) return $url; // ... 其他代码 ... }
在
post_thumbnail
函数中,你可以直接返回原图片的 URL,而不是调用biji_crop_thumbnail
函数:function post_thumbnail($width = 275, $height = 170) { global $post; if (has_post_thumbnail($post->ID)) { $thumbnail_ID = get_post_thumbnail_id($post->ID); $thumbnailsrc = wp_get_attachment_image_src($thumbnail_ID, 'full'); return $thumbnailsrc[0]; } else { $content = $post->post_content; preg_match_all('/<img.*?(?: |\\t|\\r|\\n)?src=[\'"]?(.+?)[\'"]?(?:(?: |\\t|\\r|\\n)+.*?)?>/sim', $content, $strResult, >PREG_PATTERN_ORDER); if (count($strResult[1]) > 0) { return $strResult[1][0]; } else { return false; } } }
这样,修改后的代码将会保持缩略图与原图片尺寸和大小一致,不再进行裁剪操作。
按照ChatGPT的方法修改后,马上文章列表界面就不再用模版定义的方式生成缩略图,以及读取图片也从Wordpress本身的upload文件夹读取原始文件了,太棒了。
所以,能够理解,为什么当ChatGPT出来的时候,很多人都在惊呼,这是一个跨时代的事物,未来的人们的竞争力,已经变成了谁更好地掌握和运用人工智能,谁就更强。