Image Widget

Images play a vital role in web design, so you will most likely use the Image Widget a lot while designing your website. Let's go over all of the settings you can control for this widget.

image widget


  1. Image - Upload an image or choose Dynamic to dynamically use Posts featured image, Site Logo, and Author Profile Picture.
  2. Image Size - Choose the size of the image
  3. Alignment - Set the image Alignment
  4. Caption - Add caption to the bottom of the image.
  5. Link To - Set a link to a URL, media file or no link.


  1. Width - Set the Image Width
  2. Max Width - Set the Max Width for the Image
  3. Height - Set the Height of this image.
  4. Object Fit - If Height is set, this option is displayed. Select from Default, Fill, Cover, or Contain.
  5. Opacity - Set the opacity
  6. CSS Filters - Set CSS Filters: Blur, Brightness, Contrast and Saturation
  7. Transition Duration - Set the Hover Animation duration from the Hover tab
  8. Hover Animation - Click the dropdown on the Hover tab to choose a Hover Animation
  9. Border Type - Set a Border Type
  10. Border Radius - Set a Border Radius
  11. Box Shadow - Set Box Shadow: Horizontal, Vertical, Blur and Spread
  12. Caption - Set the Alignment, Text Color, Background Color, Text Shadow, Typography, and Spacing of the caption.

Note: Blend Modes/CSS Filters do not work with Internet Explorer.


Set the Advanced options that are applicable to this widget