Photon image resizing
External Images includes optional image resizing using the Jetpack Photon service. To use this image resizing, follow these steps:
Photon serves each thumbnail from Jetpack’s global CDN at the exact pixel size your theme asks for, so a large source original (say 4000px wide on an affiliate CDN) is never downloaded full-size by the visitor. This keeps pages fast even when the originals you link to are big.
Install JetPack
Visit plugins -> add new, and install Jetpack
After installation, click the button to ‘Setup Jetpack’ and then connect your WordPress account.
JetPack is now installed.
Enable image resizing in External Images
Visit Settings -> External Images
Enable the Photon/Jetpack Image Resizing option
Check your theme settings to configure thumbnail sizes
Every theme is different, but if you’re using the Photon image resizing option then External Images will pick up the image size for thumbnails from the relevant part of WordPress. Normally, this would be set in Settings -> Media as per the below image:
Normally, WooCommerce thumbnail sizes would be configured in Appearance -> Customize -> WooCommerce -> Product Images:
Some themes may have additional thumbnail settings in Theme Options -> WooCommerce or similar to allow you to configure thumbnail sizes.
Test your image sizes
Visit your site where you can see your thumbnails and rick click the images and select Open in New Tab
The URL for your images should begin with https://i1.wp.com/ (or closely similar) which is where the Photon Jetpack image resizing service lives and the image should be the size you have configured for your thumbnails.
When you enable Photon image resizing, the CSS image resizing built into External Images is switched off. The two do the same job by different means: CSS resizing constrains the full image in the browser, whereas Photon fetches a genuinely smaller file. Only one is active at a time.
Comments