SlowlyImage
Place an image, from your media library or a dynamic source, with size and styling control.
The Image block places a picture on the page, decorative or load-bearing. It is what you reach for when the picture is content in its own right rather than a background fill.
Adding one
- Select the section or container to hold it.
- Open the inserter and search "image".
- Pick the Image block, then choose your source from the panel.
Settings
In the image's own panel. Layout, spacing, and effects are in the shared design panel.
| Setting | What it does | Reach for it when |
|---|---|---|
| Source | The image itself: pick from the media library or switch to dynamic to pull in a featured image or ACF field | Always; the block is empty until a source is set |
| Alt text | The written description attached to the image element | Every image that carries meaning; leave empty only for pure decoration |
| Caption | Optional text shown beneath the image | A photo credit or a short label the visitor should read |
| Size | Which WordPress-generated size is served (thumbnail, medium, large, full, or a custom registered size) | Smaller sizes for thumbnails or card images; full for hero shots |
| Object fit | How the image fills its container: cover, contain, or none | Cover when the image must fill a fixed box without letterboxing; contain to show the whole image |
| Object position | Which part of the image stays centred when object fit crops it | When cover cuts off a face or focal point you want to keep visible |
| Lightbox | Opens the full image in an overlay on click | Portfolio or product images where visitors want to zoom in |
| Lazy load | Defers loading until the image is near the viewport | Almost always on; turn off only for above-the-fold images that should load immediately |
| Disable srcset | Stops WordPress from generating responsive size variants | Rarely needed; useful if the image must always load at a fixed pixel size |
| Animation | A hover motion: zoom, pan, or similar | A subtle zoom on a card image or a portfolio thumbnail |
Styling
The full design panel is available: dimensions, spacing, borders, effects, and filters, each per breakpoint. The hover state is where animation timing and filter changes live when you want the image to respond to the pointer beyond the built-in animation options.
Accessibility
Every image that carries meaning needs alt text. Write what the image shows and why it is there, not a file name or a string of keywords. If the image is purely decorative, leave alt text empty so screen readers skip it rather than reading a file name aloud. For images inside a lightbox, the alt text on the thumbnail carries into the overlay, so it should describe the full image, not just the cropped view.