Adding images

You can add images to blocks directly from your computer. There are two ways of doing it:

Adding your own images instead of demo content

  1. Click on any demo image in your block. In the menu that appears, click the Edit Image icon to launch the Image Resizer:

Screenshot_2021-06-02_at_15.38.03.png

  1. In the Image Resizer, click the Upload Image icon:

Screen_Shot_2021-04-20_at_15.25.43.png

3. In the drop-down menu, choose one of the options: to use a file from your device or to use a free stock image:

Screen_Shot_2021-04-20_at_15.27.51.png

 

Once you have decided on which image to add to the page, you can quickly resize the image and change its focal point. Simply click on the image and move it around the pre-formatted grid to pick the best area of the image to display.

In the Image resizer menu, you can move the lever to resize the image so that it best fits the layout of the block. The Sitebuilder automatically adjusts the image shape for the particular block’s layout.

Dec-10-2019_12-28-12.gif

 

4. Once done adjusting, click the Submit icon:

Screen_Shot_2021-04-20_at_15.30.24.png

Click Publish to make your changes live. 

Note: the proportions and layout of images have been pre-designed to make the page layout look professional and modern. If you need more images on the page, you can use blocks such as Image or Gallery to display more images. 

Adding images to Text and Article blocks

You can add images directly to text-rich blocks such as Text and Article. Here's how to do it:

1. Find a spot on the page (between text lines) where you want to add an image. Click to activate the menu.

2. Click on the Insert Image icon:

Screen_Shot_2021-04-20_at_15.47.40.png

3. Choose an image from your device and resize or refocus it as described in the steps above.

4. Click Submit and then Save to make your changes live.

Note: At the moment, you can insert an image only to one type of Article block.

Adding animated .gif images

Absolutely! You can add a bit of action to your page with animated gifs (.gif file format). They are great to showcase your products from various dimensions, adding a moving image with a promotion, or bringing your event to life with a short video, without having to embed the video file. Here's how you can do it:  

1. Hover over the image you want to replace with a gif to activate the Edit image icon.

2. In the Image resizer window, click the Upload Image icon and choose the new animated gif from your computer. 

4. When the animated gif uploads, move the handle to best fit the image in a preformatted area that will be displayed on your page. Once done, click the Submit icon.

animated_gif1.png

Congratulations! You have inserted an animated gif image on your page. It now can be resized like the rest of the images, using a black handle at the bottom of the image frame.

animated_gif2.gif

Animated images add movement and context to your page but use them in moderation.

 

Other helpful articles

Recommended image sizes

Adding image alt text

Making your images clickable

Adding a row of images

Was this article helpful?
0 out of 0 found this helpful