HTML IMG
HTML IMG displays an image through explicit HTML image attributes. Use it when you need direct control over the image source and dimensions rather than the standard Image element's media controls.
Add and configure HTML IMG
- Click Add, choose HTML IMG, and place it in the container.
- Open Content > Content > Attributes.
- Set the image Src, Alt, Width, and Height fields as needed.
- Replace any sample image address and check that the chosen URL loads on the front end.
- Save your changes.
This element has no children; use its own controls.
Controls
Responsive varies by breakpoint; Hover has a hover value; Shared applies across both. Linked controls have their own reference. In conditions, = means “is” and ≠ means “is not.”
Content > Content
| Setting | Purpose and options | Behavior |
|---|---|---|
| Attributes > src | Enter the src. | Shared |
| Attributes > srcset | Enter the srcset. | Shared |
| Attributes > sizes | Enter the sizes. | Shared |
| Attributes > alt | Enter the alt. | Shared |
| Attributes > loading | eager, lazy. | Shared |
| Attributes > width | Width. | Shared |
| Attributes > height | Height. | Shared |
Troubleshooting
The image does not load
Open the source URL directly and confirm it is a reachable image. Check for a misspelled path or an HTTP asset on an HTTPS page.
The image stretches
Review Width and Height against the original proportions. Check any CSS applied to the element.