Articles on: Components & Elements

Image Element

Getting Started


You can add images to your website by using the Image element. This article will feature all the steps required to add an image to your website. Follow the instructions accordingly to add, shape, and customize an image on your website.



Adding the Image element


Follow the steps below to add an Image element to your site.


  • Click on + Add Element or Containers in an empty Container
  • From the Elements option, select the Image element


Refer to the GIF & screenshots below:





Image Element



Image element on builder



Editing the Image element


Follow the steps and instructions below to add and edit an Image element on your site.


The Image element editor has the following options:


  • Image options
  • Image Width and Height
  • Filters
  • Background Image


The Image element editor:




Image Options


Here are some options for working with images: you can upload a new image, select one from your library, or use a URL to embed an image. You can also generate an image using AI for your element, and make additional edits such as adjusting alignment or adding links.




Image Width and Height


This setting allows you to resize your image by changing its width, height, and position. You can also choose to fit the image, and there are advanced options for minimum and maximum width and height.


Refer to the Video below to see all the settings demonstrated:




Filters


This option lets you edit your image with necessary settings like changing the hue, saturation, contrast, brightness, and many more.


Refer to the GIF below to see all the settings demonstrated:




Background of Image


This option lets you add a background to your image; it can be a plain color, gradient, or another image.


Refer to the GIF below to see all the settings demonstrated:







Add an Image Slider


Add Custom Code

Updated on: 05/06/2024

Was this article helpful?

Share your feedback

Cancel

Thank you!