The Media Settings tab in Site Settings controls how images are resized, processed, and optimized across the entire site. These settings affect:
- Blog post images
- Product images
- Thumbnails
- Image quality and output format
- How images are cropped, stretched, or resized
These configurations are essential for performance optimization, consistent image display, and responsive design.
1. Post Image Sizes
These settings define how images attached to posts (blog posts, articles, custom post types) are resized.
Each size includes:
- Width
- Height
- Resize Method
Tip: To maintain aspect ratio, set either width or height to 0.
Extra Large
- Width: 1024
- Height: 0
- Method: Crop & Resize
- Usage:
- Hero images
- Featured images in large layouts
- Full‑width blog headers
Large
- Width: 800
- Height: 0
- Method: Stretch
- Usage:
- Standard post images
- Blog listing pages
Medium
- Width: 400
- Height: 0
- Method: Stretch
- Usage:
- Sidebar widgets
- Related posts
- Smaller content blocks
Thumb
- Width: 150
- Height: 0
- Method: Stretch
- Usage:
- Thumbnails
- Category lists
- Recent posts widgets
2. Product Image Sizes
These settings define how product images are resized for ecommerce pages.
Extra Large
- Width: 1024
- Height: 0
- Method: Crop & Resize
- Usage:
- Product detail page main image
- Zoomable product images
Large
- Width: 800
- Height: 0
- Method: Stretch
- Usage:
- Product listing grids
- Category pages
Medium
- Width: 400
- Height: 0
- Method: Stretch
- Usage:
- Smaller product cards
- Mobile layouts
Thumb
- Width: 150
- Height: 0
- Method: Stretch
- Usage:
- Product thumbnails
- Variant selectors
- Mini‑cart previews
3. Resize Methods Explained
| Method | Description |
|---|---|
| Crop & Resize (cs) | Crops the image to fit the target size, then resizes it. Best for consistent aspect ratios. |
| Crop (c) | Crops the image without resizing. |
| Resize (r) | Resizes the image proportionally without cropping. |
| Stretch (s) | Forces the image to fit the exact dimensions (may distort). |
4. Image Output Settings
These settings control how images are saved after processing.
Format
- Options:
- Original (keeps the uploaded format)
- Other formats if enabled by plugins
- Usage:
- Keep original for maximum compatibility
- Convert to WebP or AVIF (if supported) for performance
Quality
- Field: Quality
- Default:
80 - Description:
Controls compression level for JPEG/WebP images.
Higher = better quality, larger file size.
Lower = smaller file size, reduced quality.
5. Aspect Ratio Tip
A note in the interface states:
To keep image proportion set either height or width to 0 (zero).
This ensures images scale proportionally without distortion.
Summary
The Media Settings Tab configures:
- Post image sizes
- Product image sizes
- Resize behavior (crop, stretch, resize)
- Image output format
- Image quality
These settings ensure consistent image presentation across your site and help optimize performance for both desktop and mobile users.