Image v1

Image V1 is the earlier Image element retained for existing designs. It is hidden from the current Add panel. Use the current Image element for new content.

Edit an existing Image V1

1. Open the document containing the older image and select it in the Structure panel.
2. Change Content > Content > Image or the related size, alternative text, caption, and link controls.
3. Check Design for dimensions, effects, borders, spacing, caption, and lightbox styling.
4. Save and inspect the front end at the affected breakpoints and hover state.

For example, replace a photograph in an older landing page while retaining its established caption and image dimensions.

Replace an older image deliberately

Add a current Image element when you want to migrate the design. Recreate its media, alternative text, link, caption, and relevant styling, then compare the rendered result before removing the older instance. The two elements have different control contracts; copying their serialized properties is not a verified migration method.

Existing control reference

Responsive controls can vary by breakpoint. Hover controls have a separate hover value. The remaining settings use shared values.

Content > Content

Setting	Purpose and options	Behavior
Image	Choose media from the WordPress media library.	Shared value
Image Size	Choose a registered WordPress image size or a custom size.	Shared value
Alt > Alt	Choose Disable, Custom.	Shared value
Alt > Custom Alt	Alternative text describing the image. Available when Alt is Custom.	Shared value
Caption > From Library	Turn From Library on or off.	Shared value
Caption > Caption	Enter the caption. Available when From Library is unset.	Shared value
Link > Link	Choose URL, Full Size Image, Lightbox.	Shared value
Link > URL	Destination URL. Available when Link is URL.	Shared value
Link > New Tab	Turn New Tab on or off. Available when Link is URL, Full Size Image.	Shared value
Link > Image Size	Choose a registered WordPress image size or a custom size. Available when Link is Lightbox.	Shared value
Lazy Load	Turn Lazy Load on or off.	Shared value

Design > Image

Setting	Purpose and options	Behavior
Width	Width of this part of the element.	Responsive
Max Width	Set max width and its unit.	Responsive
Height	Height of this part of the element.	Responsive
Aspect Ratio	Choose 1:1, 4:3, 3:2, 16:9, 8:5, Custom.	Responsive
Custom Ratio > Width	Width of this part of the element. Available when Aspect Ratio is Custom.	Responsive
Custom Ratio > Height	Height of this part of the element. Available when Aspect Ratio is Custom.	Responsive
Object Fit	Choose Cover, Contain, Fill, None. Available when Height is set or Aspect Ratio is set.	Responsive
Object Position	Set object position. Available when Object Fit is set.	Responsive
Zoom	Set zoom and its unit.	Hover
Focus Point	Set focus point. Available when Zoom is set.	Hover

Design > Effects

Setting	Purpose and options	Behavior
Opacity	Set opacity. Range: 0–1.	Hover
Filters > Filter Items	Add, edit, remove, and reorder filter items.	Hover
Filters > Filter Items > Type	Choose blur, brightness, contrast, grayscale, hue-rotate, invert, saturate, sepia.	Shared value
Filters > Filter Items > Blur Amount	Set blur amount and its unit. Available when Type is blur.	Shared value
Filters > Filter Items > Amount	Set amount and its unit. Available when Type is brightness, contrast, grayscale, invert, saturate, sepia.	Shared value
Filters > Filter Items > Rotate	Set rotate and its unit. Available when Type is hue-rotate.	Shared value
Transition Duration	Time used for the transition.	Shared value
Mask > Shape	Choose Donut, Tv, Waves, Waves 2, Blob, Star 1, Star 2, Star 3, Star 4, Stripes, Pill, Custom.	Shared value
Mask > Custom Shape	Choose media from the WordPress media library. Available when Shape is Custom.	Shared value
Mask > Size	Choose Contain, Cover, Custom.	Shared value
Mask > Custom Size	Set custom size and its unit. Available when Size is Custom.	Shared value
Mask > Position	Set position.	Shared value
Mask > Repeat	Choose no-repeat, repeat, repeat-x, repeat-y, space, round.	Shared value
Blend Mode	Choose normal, multiply, screen, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, hue, saturation, color, luminosity.	Shared value

Design > Borders

Setting	Purpose and options	Behavior
Borders	Use the shared borders controls.	See shared controls

Design > Spacing

Setting	Purpose and options	Behavior
Spacing	Use the shared spacing controls.	See shared controls

Design > Caption

Setting	Purpose and options	Behavior
Position	Choose Overlap, Below.	Shared value
Background	Choose the color or supported color fill.	Shared value
Typography	Use the shared typography controls.	See shared controls
Borders	Use the shared borders controls.	See shared controls
Spacing	Use the shared spacing controls.	See shared controls

Design > Lightbox

Setting	Purpose and options	Behavior
Lightbox	Use the shared lightbox controls.	See shared controls

Troubleshooting