Imagery
The image sizes the theme generates per context, and what to upload for each.
The theme leans on WordPress's built-in sizes (thumbnail, medium, medium_large, large, full) and adds three custom sizes where the defaults left gaps. You don't pick a size when adding content: each component requests the right one and the browser serves the best fit from the generated srcset. Your job is to upload a good original.
Custom sizes
Registered in the theme's functions.php, tuned to its real display contexts. All are width-bounded and uncropped, since components frame images with CSS object-fit and srcset only needs the right widths.
| Size | Width | Used for |
|---|---|---|
wha-bio | 400px | Provider bio headshot |
wha-media | 1400px | copy-with-media and inline content images |
wha-hero | 2000px | Full-width section heroes |
These fill the gaps WordPress's default ladder left between medium (300px) and large (1024px), and between large and the full original.
New sizes only generate for new uploads. To backfill existing media, run the Offload Media → Thumbnails regeneration: it generates the missing sizes and uploads them to S3. A plain "regenerate thumbnails" won't push them to cloud storage.
Sizes by context
| Where it appears | Size the theme requests | Upload at least |
|---|---|---|
| Full-width section heroes | wha-hero (2000px) | 2000–2560px wide |
| News and blog featured image | full (original) | ~1600px wide |
| copy-with-media and inline content | wha-media (1400px) | ~1600px wide |
| Provider and location detail hero photo | large (≤1024px) | ~1200px wide |
| Provider, location and life-stage cards | medium_large (≤768px) | ~800px wide |
| Provider bio headshot | wha-bio (400px) | ~800px wide, portrait |
Upload guidance
- Upload at roughly 2× the display size, not camera resolution. A 5000px file for an 800px card wastes bandwidth even after optimization.
- You don't make WebP yourself. Uploaded media is offloaded to S3 (the
yax-offload-mediaplugin) and converted to WebP automatically. Upload JPG for photos, PNG for graphics with transparency, SVG for icons. - Keep originals reasonable. A few contexts serve the
fulloriginal, so the file you upload is what loads. See Managing Providers for provider-photo specifics.