Я пытаюсь начать использовать функцию адаптивных изображений Wordpress по очевидным причинам, связанным с размером страницы, но у меня возникли небольшие проблемы с правильным возвратом атрибута sizes
, чтобы сообщить браузеру, какие изображения загружать. Я успешно обновил размеры изображений на своем сайте, оставив мне всего 5 размеров (9999 пикселей, используемых, чтобы избежать обрезки по высоте):
thumbnail
= 414x9999px
medium
= 1024x9999px
medium_large
= 768pxx9999px
large
= 1440x9999 пикселей
full
= Исходный размер загружен
Они правильно выводятся в srcset при использовании wp_get_attachment_image('image_id');
, однако я не могу установить атрибут размеров для соответствия. Текущий srcset
вывод:
src="http://husk.local/wp-content/uploads/2019/06/Husk-072-414x276.jpg"
srcset="http://husk.local/wp-content/uploads/2019/06/Husk-072-414x276.jpg 414w,
http://husk.local/wp-content/uploads/2019/06/Husk-072-1024x682.jpg 1024w,
http://husk.local/wp-content/uploads/2019/06/Husk-072-768x512.jpg 768w,
http://husk.local/wp-content/uploads/2019/06/Husk-072-1440x960.jpg 1440w"
У меня остался выход Wordpress по умолчанию sizes="(max-width: 414px) 100vw, 414px"
, однако я хочу сказать браузеру, что нужно получить определенное изображение, когда оно имеет определенный размер области просмотра, то есть область просмотра 414 пикселей в ширину, получить thumbnail
изображение, область просмотра 768 пикселей шириной, получить medium_large
изображение и т. д.
Я следовал некоторым учебникам в Интернете, но безуспешно, но кажется, что это должно быть довольно просто вывести на глобальном уровне? Любые указатели будут высоко оценены.