From bb5d68385a796eed86fa4c4d65ed56cf4905de7b Mon Sep 17 00:00:00 2001 From: Kelly Dwan Date: Fri, 22 Sep 2023 17:45:27 -0400 Subject: [PATCH] Images: Add extra sizes for desktop screenshot --- .../themes/wporg-showcase-2022/functions.php | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/source/wp-content/themes/wporg-showcase-2022/functions.php b/source/wp-content/themes/wporg-showcase-2022/functions.php index 9e45c2d4..92305c5a 100644 --- a/source/wp-content/themes/wporg-showcase-2022/functions.php +++ b/source/wp-content/themes/wporg-showcase-2022/functions.php @@ -62,6 +62,17 @@ function setup_theme() { add_image_size( 'screenshot-desktop', 2044, 1150, array( 'center', 'top' ) ); add_image_size( 'screenshot-mobile', 750, 1334, array( 'center', 'top' ) ); + // More desktop sizes to support responsive images in the grid. + // In production these will be generated using Photon CDN, but we can set + // them up as real sizes for local support too. + // Images in the grid are display from 340-740px wide. This set of sizes + // should cover 1x and 2x resolution. + $desktop_ratio = 1150 / 2044; + add_image_size( 'screenshot-desktop-1400', 1400, 1400 * $desktop_ratio, array( 'center', 'top' ) ); + add_image_size( 'screenshot-desktop-1100', 1100, 1100 * $desktop_ratio, array( 'center', 'top' ) ); + add_image_size( 'screenshot-desktop-800', 800, 800 * $desktop_ratio, array( 'center', 'top' ) ); + add_image_size( 'screenshot-desktop-500', 500, 500 * $desktop_ratio, array( 'center', 'top' ) ); + // Add tonesque support so that Jetpack loads the class. add_theme_support( 'tonesque' );