◆ 设定自定义尺寸
protected function setup_hooks() {
add_action( 'after_setup_theme', [ $this, 'register_image_size' ] );
}
public function register_image_size() {
// 基础尺寸
add_image_size('fanhua-sm', 640, 360, true); // 移动端
add_image_size('fanhua-md', 960, 540, true); // 平板
add_image_size('fanhua-lg', 1280, 720, true); // 桌面
add_image_size('fanhua-xl', 1920, 1080, true); // 大屏
// 特殊比例
add_image_size('fanhua-square', 600, 600, true); // 正方形
add_image_size('fanhua-portrait', 800, 1200, true); // 竖版
}在wordpress后台媒体库上传图片，会按照设定的自定义尺寸、系统默认尺寸进行图片裁剪。
◆ 查看媒体库元数据
wp_get_attachment_metadata：在 WordPress 里，当你上传一个附件到媒体库时，系统会自动为这个附件生成一些元数据，这些元数据包含了附件的各种信息，如文件路径、尺寸、不同缩略图版本的信息等。wp_get_attachment_metadata 函数的作用就是获取这些元数据，方便开发者在编写主题或插件时使用这些信息来进行特定的操作，比如展示图片的不同尺寸版本、获取文件的原始路径等。
如果上传图片后发现系统自动生成相关尺寸【失败】，可能缺少GD 库或者 ImageMagick 扩展，具体见【wordpress-媒体库无法编辑图片】。
$attachment_id = 51;
$image_meta = wp_get_attachment_metadata( $attachment_id );
// 输出$image_meta如下：
Array
(
[width] => 2000
[height] => 1411
[file] => 2025/02/fanhua-10-5.jpg
[filesize] => 427780
[sizes] => Array
(
[medium] => Array
(
[file] => fanhua-10-5-300x212.jpg
[width] => 300
[height] => 212
[mime-type] => image/jpeg
[filesize] => 13134
)
[large] => Array
(
[file] => fanhua-10-5-1024x722.jpg
[width] => 1024
[height] => 722
[mime-type] => image/jpeg
[filesize] => 89113
)
[thumbnail] => Array
(
[file] => fanhua-10-5-150x150.jpg
[width] => 150
[height] => 150
[mime-type] => image/jpeg
[filesize] => 6718
)
[medium_large] => Array
(
[file] => fanhua-10-5-768x542.jpg
[width] => 768
[height] => 542
[mime-type] => image/jpeg
[filesize] => 55547
)
[1536x1536] => Array
(
[file] => fanhua-10-5-1536x1084.jpg
[width] => 1536
[height] => 1084
[mime-type] => image/jpeg
[filesize] => 176567
)
[chenzz-width] => Array
(
[file] => fanhua-10-5-100x71.jpg
[width] => 100
[height] => 71
[mime-type] => image/jpeg
[filesize] => 2922
)
[fanhua-sm] => Array
(
[file] => fanhua-10-5-640x360.jpg
[width] => 640
[height] => 360
[mime-type] => image/jpeg
[filesize] => 35328
)
[fanhua-md] => Array
(
[file] => fanhua-10-5-960x540.jpg
[width] => 960
[height] => 540
[mime-type] => image/jpeg
[filesize] => 68078
)
[fanhua-lg] => Array
(
[file] => fanhua-10-5-1280x720.jpg
[width] => 1280
[height] => 720
[mime-type] => image/jpeg
[filesize] => 109150
)
[fanhua-xl] => Array
(
[file] => fanhua-10-5-1920x1080.jpg
[width] => 1920
[height] => 1080
[mime-type] => image/jpeg
[filesize] => 216195
)
[fanhua-square] => Array
(
[file] => fanhua-10-5-600x600.jpg
[width] => 600
[height] => 600
[mime-type] => image/jpeg
[filesize] => 53903
)
[fanhua-portrait] => Array
(
[file] => fanhua-10-5-800x1200.jpg
[width] => 800
[height] => 1200
[mime-type] => image/jpeg
[filesize] => 118442
)
)
[image_meta] => Array
(
[aperture] => 0
[credit] =>
[camera] =>
=>
[created_timestamp] => 0
[copyright] =>
[focal_length] => 0
[iso] => 0
[shutter_speed] => 0
[title] =>
[orientation] => 1
[keywords] => Array
(
)
)
)上面元数据中，除了自定义尺寸，还有一些系统默认尺寸，如下图：
WordPress 自身带有几种预设的图片尺寸：
thumbnail // 缩略图，默认150×150像素
medium // 中等尺寸，默认300×300像素
medium_large // 中等偏大尺寸，默认768×0像素（高度自适应）
large // 大尺寸，默认1024×1024像素
full // 原始上传的图片尺寸◆ 返回指定尺寸url
wp_get_attachment_image_srcset： 函数的设计初衷是为了支持响应式图片。它会返回一个包含多个不同尺寸图片的 srcset 字符串，这样浏览器可以根据设备的屏幕尺寸、分辨率等因素，自动选择最合适的图片进行加载，从而优化用户体验和节省带宽。
$attachment_id = 51;
$srcset = wp_get_attachment_image_srcset( $attachment_id, 'fanhua-square' );
if ( $srcset ) {
echo '<img srcset="' . esc_attr( $srcset ) . '" src="' . esc_url( wp_get_attachment_url( $attachment_id ) ) . '" alt="图片">';
}
/*$srcset输出：
https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5-600x600.jpg 600w,
https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5-150x150.jpg 150w
*/浏览器元素查看
<img
srcset="https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5-600x600.jpg 600w,
https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5-150x150.jpg 150w"
src="https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5.jpg"
alt="图片"
>如上可知，wp_get_attachment_image_srcset 函数在生成 srcset 时，除了返回指定尺寸外，还有默认尺寸如 thumbnail（通常是 150x150）、以及会尝试选择与指定尺寸相关且适合不同设备屏幕的尺寸。
如果只想获取 fanhua-square 尺寸的图片链接，而不是 srcset 字符串，可以使用 wp_get_attachment_image_src 函数，如下：
$attachment_id = 51;
$image = wp_get_attachment_image_src( $attachment_id, 'fanhua-md' );
echo '<img src="' . esc_url( $image[0] ) . '" alt="图片">';
/*$image调试输出：
Array
(
[0] => https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5-960x540.jpg
[1] => 960
[2] => 540
[3] => 1
)
*/
如果想要返回原图，即直接返回附件文件本身的直接链接，不涉及图片的特定尺寸信息。则用wp_get_attachment_url函数
$attachment_id = 51;
$url = wp_get_attachment_url( $attachment_id );
/*url测试输出：
https://example3.chenzhuzhen.cn/wp-content/uploads/sites/3/2025/02/fanhua-10-5.jpg
*/也可以直接调用wp_get_attachment_image函数直接输出img标签
<?php echo wp_get_attachment_image(1519, 'medium', false, ['class' => 'image', 'alt' => 'Antibacterial insoles ']); ?>