Я хочу использовать адаптивные изображения для моего сайта Wordpress. Я изменил размеры изображения по умолчанию и добавил некоторые сверху в мой functions.php
:
add_action('init', function(){
// adjusting
update_option( 'thumbnail_size_w', 300, false );
update_option( 'thumbnail_size_h', 0, false );
update_option( 'thumbnail_crop', 0 );
update_option( 'medium_size_w', 1000, false );
update_option( 'medium_size_h', 0, false );
update_option( 'medium_crop', 0 );
update_option( 'medium_large_size_w', 1600, false );
update_option( 'medium_large_size_h', 0, false );
update_option( 'medium_large_crop', 0 );
update_option( 'large_size_w', 2000, false );
update_option( 'large_size_h', 0, false );
update_option( 'large_crop', 0 );
// adding
add_image_size( 'i100', 100, '0', false );
add_image_size( 'i200', 200, '0', false );
add_image_size( 'i400', 400, '0', false );
add_image_size( 'i600', 600, '0', false );
add_image_size( 'i800', 800, '0', false );
add_image_size( 'i1300', 1300, '0', false );
add_image_size( 'i2500', 2500, '0', false );
});
Это должно привести к списку из 11 размеров, таких как:
100
, 200
, 300
, 400
, 600
, 800
, 1000
, 1300
, 1600
, 2000
, 2500
Если я загружаю новые изображения, они уменьшаются точно до этих размеров, в том числе и при использовании плагина Regenerate-Thumbnails-Plugin. Хорошо. Я также увеличил размер max_srcset_image_width
до 2500
.
Так что теперь, когда я хочу сделать изображение, используя
wp_get_attachment_image( $attachment_id, 'large' );
магия начинается:
Иногда результат почти такой же, как ожидалось:
<img src="image1-1300x867.jpg"
srcset="image1-1300x867.jpg 1300w,
image1-1600x1068.jpg 1600w,
image1-2000x1335.jpg 2000w,
image1-100x67.jpg 100w,
image1-300x200.jpg 300w,
image1-1000x667.jpg 1000w,
image1-200x133.jpg 200w,
image1-400x267.jpg 400w,
image1-600x400.jpg 600w,
image1-800x534.jpg 800w,
image1-2500x1668.jpg 2500w" >
-> Я вызвал large
, который я определил как 2000
по ширине, вместо этого я получил 1300
как выбранное по умолчанию изображение. И порядок не очень красивый. Но эй, неважно, по крайней мере, это работает.
Иногда даже нет нескольких размеров:
<img src="image2.jpg">
-> Но эй, изображение появляется
Иногда неопределенный размер (например, 333
) смешивается в srcset, который не находится в каталоге загрузки и, следовательно, приводит к поврежденному изображению:
<img src="image3-1300x1950.jpg"
srcset="image3-1300x1950.jpg 1300w,
image3-1600x2400.jpg 1600w,
image3-2000x3000.jpg 2000w,
image3-100x150.jpg 100w,
image3-333x500.jpg 333w,
image3-300x450.jpg 300w,
image3-1000x1500.jpg 1000w,
image3-200x300.jpg 200w,
image3-400x600.jpg 400w,
image3-600x900.jpg 600w,
image3-800x1200.jpg 800w,
image3-2500x3750.jpg 2500w" >
-> Но, эй, 11 из 12 источников работают
Иногда странные размеры берут на себя:
<img src="image4-700x1050.jpg"
srcset="image4-700x1050.jpg 700w,
image4-333x500.jpg 333w,
image4-250x375.jpg 250w,
image4-768x1152.jpg 768w,
image4-120x180.jpg 120w,
image4-1333x2000.jpg 1333w,
image4-2000x3000.jpg 2000w,
image4-500x750.jpg 500w,
image4-1000x1500.jpg 1000w" >
-> На самом деле в папке для загрузки находятся только размеры 1000
и 2000
. Все остальные размеры не существуют в виде реальных файлов и не могут быть показаны в браузере.
Примечание: я удалил другие атрибуты из HTML, изменил URL для удобства чтения. Эти 4 примера созданы с использованием точно такого же кода, в том же файле шаблона, а также с очень похожими изображениями. Но: странность остается неизменной для каждого изображения, например HTML-код для image2 всегда выглядит одинаково.
Что я могу сделать, чтобы получить здесь заказ и избежать битых ссылок на изображения?
Я думаю, что мне нужно точно сказать Wordpress, какие размеры использовать в атрибуте srcset. Но я не мог найти решение для этого.
Редактировать: Получается, что неправильные размеры изображений поступают из базы данных, сохраненной как _wp_attachment_metadata
в таблице wp_postmeta
. Теперь вопрос: как я могу обновить всю эту информацию?