Медиафайлы (картинки) в WordPress

При загрузке картинки WP сохраняет данные в базу данных: добавляет данные в таблицу wp_posts и устанавливает метаданные.

Ниже рассмотрим как WordPress хранит вложения в БД (картинки или файлы), т.е рассмотрим структуру картинок (медиа-файлов) и то, как храняться картинки в вордпресс.

Оглавление:

Пример с ресайзом (WP 5.3)
Пример с большой фоткой -scaled (WP 5.3)
Пример с изменением ориентации -rotated (WP 5.3)
PHP Функции Получения вложений
PHP Функции Получения картинок
PHP Функции Загрузки файлов (медиа)

В таблицу wp_posts добавляется:

global $wpdb;
$po = $wpdb->get_row( "SELECT * from $wpdb->posts where ID = 1821" );
print_r( $po );

/*
stdClass Object
(
	[ID]                    => 1821
	[post_author]           => 1
	[post_date]             => 2020-03-08 22:55:32
	[post_date_gmt]         => 2020-03-08 17:55:32
	[post_content]          =>
	[post_title]            => sredyaya-kartinka-e1583064965160
	[post_excerpt]          =>
	[post_status]           => inherit
	[comment_status]        => open
	[ping_status]           => closed
	[post_password]         =>
	[post_name]             => sredyaya-kartinka-e1583064965160
	[to_ping]               =>
	[pinged]                =>
	[post_modified]         => 2020-03-08 22:55:32
	[post_modified_gmt]     => 2020-03-08 17:55:32
	[post_content_filtered] =>
	[post_parent]           => 5
	[guid]                  => http://example.com/wp-content/uploads/2020/03/sredyaya-kartinka-e1583064965160.jpg
	[menu_order]            => 0
	[post_type]             => attachment
	[post_mime_type]        => image/jpeg
	[comment_count]         => 0
)
*/

Полезных полей в этой таблице не много, это:

post_title — Заголовок.
post_content — Описание (указывается в админке).
post_excerpt — Подпись caption.
post_mime_type — MIME тип.
post_date, post_date_gmt — Дата добавления вложения.
guid — URL файла. Но доверять этому полю не всегда можно, надежнее получить URL через функцию wp_get_attachment_url().

Пример с ресайзом (WP 5.3)

Пример когда изображение было загружено и отредактировано в редакторе (было сделано кадрирование).

После этого измененная картинка полностью заменяет оригинал. Оригинал (файл) при этом не удаляется, а единственное упоминание о нём сохраняется в метаполе _wp_attachment_backup_sizes.

Пример с большой фоткой `-scaled` (WP 5.3)

Подробнее про scaled размер читайте здесь.

Просто загружена большая фотка с которой создались все возможные размеры.

Пример с изменением ориентации `-rotated` (WP 5.3)

Если при загрузке картинки в её EXIF данных указанна ориентация и она отличается от 1. То это значит что физический фал картинки имеет нестандартную ориентацию (ориентация картинки нарушена) и ВП это исправляет на основе указанных данных.

Как ВП обрабатывает ориентацию можно посмотреть в функции wp_create_image_subsizes() > WP_Image_Editor::maybe_exif_rotate():

2 - Flip horizontally.
3 - Rotate 180 degrees or flip horizontally and vertically.
4 - Flip vertically.
5 - Rotate 90 degrees counter-clockwise and flip vertically.
6 - Rotate 90 degrees clockwise (270 counter-clockwise).
7 - Rotate 90 degrees counter-clockwise and flip horizontally.
8 - Rotate 90 degrees counter-clockwise.

Рассмотрим на примере.

Допустим мы загрузили картинку Landscape_2.jpg у которой указаны такие exif данные:
Данные берутся функцией exif_read_data():

$exif_data = exif_read_data( ABSPATH .'../wp-content/uploads/2022/06/Landscape_2.jpg' );

print_r( $exif_data );

/*
Array (
	[FileName] => Landscape_2.jpg
	[FileDateTime] => 1656265839
	[FileSize] => 349209
	[FileType] => 2
	[MimeType] => image/jpeg
	[SectionsFound] => ANY_TAG, IFD0
	[COMPUTED] => Array
		(
			[html] => width="1800" height="1200"
			[Height] => 1200
			[Width] => 1800
			[IsColor] => 1
			[ByteOrderMotorola] => 1
		)

	[Orientation] => 2
	[XResolution] => 72/1
	[YResolution] => 72/1
	[ResolutionUnit] => 2
	[YCbCrPositioning] => 1
)

После загрузки данные ВП создаст копию загруженного изображения с суффикcом -rotated. Т.е. по итогу в папке загрузок будет лежать оригинальная картинка и измененная картинка. Измененная картинка, станет основной, а оригинальная будет указана в метаданных в ключе original_image:

Данные из таблицы wp_posts:

+-----------------------+--------------------------------------------------------------+
| Field                 | Value                                                        |
+-----------------------+--------------------------------------------------------------+
| ID                    | 1863                                                         |
| post_author           | 1                                                            |
| post_date             | 2022-06-26 17:50:39                                          |
| post_date_gmt         | 2022-06-26 17:50:39                                          |
| post_content          |                                                              |
| post_title            | Landscape_2                                                  |
| post_excerpt          |                                                              |
| post_status           | inherit                                                      |
| comment_status        | open                                                         |
| ping_status           | closed                                                       |
| post_password         |                                                              |
| post_name             | landscape_2                                                  |
| to_ping               |                                                              |
| pinged                |                                                              |
| post_modified         | 2022-06-26 17:50:39                                          |
| post_modified_gmt     | 2022-06-26 17:50:39                                          |
| post_content_filtered |                                                              |
| post_parent           | 0                                                            |
| guid                  | http://wptest.loc/wp-content/uploads/2022/06/Landscape_2.jpg |
| menu_order            | 0                                                            |
| post_type             | attachment                                                   |
| post_mime_type        | image/jpeg                                                   |
| comment_count         | 0                                                            |
+-----------------------+--------------------------------------------------------------+

Данные из таблицы wp_postmeta:

+---------+-------------------------+--------------------------------------------------------------------------------------------------------------------------------------------------------+
| post_id | meta_key                | meta_value                                                                                                                                             |
+---------+-------------------------+--------------------------------------------------------------------------------------------------------------------------------------------------------+
| 1863    | _wp_attached_file       | 2022/06/Landscape_2-rotated.jpg                                                                                                                        |
| 1863    | _wp_attachment_metadata | a:7:{s:5:"width";i:1800;s:6:"height";i:1200;s:4:"file";s:31:"2022/06/Landscape_2-rotated.jpg";s:8:"filesize";i:400881;s:5:"sizes";a:6:{s:6:"medium";a: |
|         |                         | 5:{s:4:"file";s:23:"Landscape_2-300x200.jpg";s:5:"width";i:300;s:6:"height";i:200;s:9:"mime-type";s:10:"image/jpeg";s:8:"filesize";i:14295;}s:5:"large |
|         |                         | ";a:5:{s:4:"file";s:24:"Landscape_2-1024x683.jpg";s:5:"width";i:1024;s:6:"height";i:683;s:9:"mime-type";s:10:"image/jpeg";s:8:"filesize";i:130033;}s:9 |
|         |                         | :"thumbnail";a:5:{s:4:"file";s:23:"Landscape_2-150x150.jpg";s:5:"width";i:150;s:6:"height";i:150;s:9:"mime-type";s:10:"image/jpeg";s:8:"filesize";i:60 |
|         |                         | 50;}s:12:"medium_large";a:5:{s:4:"file";s:23:"Landscape_2-768x512.jpg";s:5:"width";i:768;s:6:"height";i:512;s:9:"mime-type";s:10:"image/jpeg";s:8:"fil |
|         |                         | esize";i:75295;}s:9:"1536x1536";a:5:{s:4:"file";s:25:"Landscape_2-1536x1024.jpg";s:5:"width";i:1536;s:6:"height";i:1024;s:9:"mime-type";s:10:"image/jp |
|         |                         | eg";s:8:"filesize";i:283925;}s:14:"post-thumbnail";a:5:{s:4:"file";s:25:"Landscape_2-1568x1045.jpg";s:5:"width";i:1568;s:6:"height";i:1045;s:9:"mime-t |
|         |                         | ype";s:10:"image/jpeg";s:8:"filesize";i:295929;}}s:10:"image_meta";a:12:{s:8:"aperture";s:1:"0";s:6:"credit";s:0:"";s:6:"camera";s:0:"";s:7:"caption"; |
|         |                         | s:0:"";s:17:"created_timestamp";s:1:"0";s:9:"copyright";s:0:"";s:12:"focal_length";s:1:"0";s:3:"iso";s:1:"0";s:13:"shutter_speed";s:1:"0";s:5:"title"; |
|         |                         | s:0:"";s:11:"orientation";i:1;s:8:"keywords";a:0:{}}s:14:"original_image";s:15:"Landscape_2.jpg";}                                                     |
| 1863    | _edit_lock              | 1656265849:1                                                                                                                                           |
+---------+-------------------------+--------------------------------------------------------------------------------------------------------------------------------------------------------+

Массив: _wp_attachment_metadata:

[
	'width' => 1800,
	'height' => 1200,
	'file' => '2022/06/Landscape_2-rotated.jpg',
	'filesize' => 400881,
	'sizes' =>
		[
			'medium'         =>
				[
					'file'      => 'Landscape_2-300x200.jpg',
					'width'     => 300,
					'height'    => 200,
					'mime-type' => 'image/jpeg',
					'filesize'  => 14295,
				],
			'large'          =>
				[
					'file'      => 'Landscape_2-1024x683.jpg',
					'width'     => 1024,
					'height'    => 683,
					'mime-type' => 'image/jpeg',
					'filesize'  => 130033,
				],
			'thumbnail'      =>
				[
					'file'      => 'Landscape_2-150x150.jpg',
					'width'     => 150,
					'height'    => 150,
					'mime-type' => 'image/jpeg',
					'filesize'  => 6050,
				],
			'medium_large'   =>
				[
					'file'      => 'Landscape_2-768x512.jpg',
					'width'     => 768,
					'height'    => 512,
					'mime-type' => 'image/jpeg',
					'filesize'  => 75295,
				],
			'1536x1536'      =>
				[
					'file'      => 'Landscape_2-1536x1024.jpg',
					'width'     => 1536,
					'height'    => 1024,
					'mime-type' => 'image/jpeg',
					'filesize'  => 283925,
				],
			'post-thumbnail' =>
				[
					'file'      => 'Landscape_2-1568x1045.jpg',
					'width'     => 1568,
					'height'    => 1045,
					'mime-type' => 'image/jpeg',
					'filesize'  => 295929,
				],
		],
	'image_meta' =>
		[
			'aperture'          => '0',
			'credit'            => '',
			'camera'            => '',
			'caption'           => '',
			'created_timestamp' => '0',
			'copyright'         => '',
			'focal_length'      => '0',
			'iso'               => '0',
			'shutter_speed'     => '0',
			'title'             => '',
			'orientation'       => 1,
			'keywords'          =>
				[
				],
		],
	'original_image' => 'Landscape_2.jpg',
]

WP не всегда правильно изменяет ориентацию картинки, чтобы все работало правильно есть плагин: https://github.com/gagan0123/fix-image-rotation