Images

Overview

Image is an importnat element in every website, the images element in JoEve Builder let you place or edit images in your webpage design. Learn how to leverage the power of the Images element to achieve your goals when it comes to adding or adjusting images on your website. We’ll show you all the options, shadow, sizes and more. Enjoy.

Introduction

 

 

 

Figure 1:

Image module on Element panel.
Drag and drop the image element to any position in your webpage workspace to add image.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Figure 2:

Image: Add image (upload image)/edit image colour with filter

Shadow: Add shadow with various colour to the image frame

Link: Add hyperlink to the image

Settings: Change image size and border frame to rounded or square, change margin and padding to the image  position

Duplicate: Duplicate a copy of the edited image.

Delete: Delete the selected image

 

 

Change image

Select the image you wist to change and click on the image icon on the editing panel, click the x on the top right of the image thumbnail to delete the image.

Upload image by click on the empty area from the thumbnail. (example: you can upload image from your computer by upload new image)

Select the uploaded image

The image has been replaced with your uploaded image.

Add Shadow

Click on the image, the image editing panel will pop up, click on the colour tab on the image editing panel, select the colour you wish to add for the shadow

Change the shadow density and position by set the 4 digits number under the colour panel.
(remember the setting and you can apply to other images on your website)

Scale image

You can enlarge or reduce the size of the image by click on the corner of the image, drag the image up or down with the scale handle to
enlarge or reduce the image size

Image alignment

You can play around with the alignment button to get you optimum image position on your layout

Image Settings

You can change the border shape of your image in image settings as shown below

Change to full circle border

Remember to click “update” or “Ctrl + S” to save your editing.