The Image Widget allows you to place images easily throughout your content. Images play a vital role in web design, so you will most likely use the Image Widget a lot while designing your website. It comes with a range of styling options and integrations with other Elements.


  • Image : Select the image you want to display.
  • Size : Choose the size of the image to be displayed as Full(Original size of image), Large (Takes full space of widget), Medium (Takes average space as per widget space), Thumbnail (Small size image) or Custom size (as per user-defined size).
  • Alignment : Set the alignment of the image.
  • Max width : Set the max-width for the image in percentage.
  • CSS Filters : Set CSS Filters: Blur, Brightness, Contrast, Opacity, and Hue, etc.
  • Shadow : Set the Shadow: Horizontal, Vertical, Blur, and Shadow color.


  • Link to : Set a link to URL, Media File, Lightbox or None(no link).


  • Image caption : Set the text and color of the caption.


  • Hover effect : Toggle this button for overlay effect on the image.
  • Icon : Set the icon to display on hover.
  • Color : Choose the color of the icon.
  • Size : Set the size of the icon in a pixel(px) unit.
  • Content : Type here some text to display on hover effect. CLICK HERE to see the styling of text in this widget.
Was this helpful to you?

Leave a Reply