# How to upload a photo

> Add a photo to your ProSite page by dragging in the Picture element, then choose or upload an image.

Source: https://www.kualo.com/knowledgebase/prosite-widgets/how-to-upload-a-photo
Updated: 2026-06-09

---

Add a photo to any page in your ProSite website by using the Picture element. You can upload your own image, use one you have already added, or search the built-in free gallery.

<div style="position: relative; width: 100%; height: 0; padding-top: 56.2500%; padding-bottom: 0; box-shadow: 0 2px 8px 0 rgba(63,69,81,0.16); margin-top: 1.6em; margin-bottom: 0.9em; overflow: hidden; border-radius: 8px; will-change: transform;"><iframe allowfullscreen="allowfullscreen" allow="fullscreen" loading="lazy" style="position: absolute; width: 100%; height: 100%; top: 0; left: 0; border: none; padding: 0; margin: 0;" src="https://www.canva.com/design/DAFeYWT_8NI/watch?embed"> </iframe></div>

## Adding a photo

1. Log in to your ProSite Builder editor.
2. Drag and drop the **Picture** element on to the canvas, placing it where you want the photo to appear.

   ![Dragging the Picture element on to the canvas](https://kb-cdn.kualo.com/21/2f/212f64d4d399cfd1a1523019875dccbb111ec104.gif)

3. Select the style you want for your photo. If you do not want a border, choose the plain square option at the top left.

   ![Choosing a photo style](https://kb-cdn.kualo.com/b4/c0/b4c0cf7ae5865ca50f72dce0ac74ee25c0758f07.png)

4. Choose your image from one of three sources:
   - **My uploads** - an image you have already uploaded to ProSite.
   - **Free Gallery** - search for free stock photos directly within the editor.
   - **Your computer** - drag and drop an image file from your desktop to upload it.

   :::tip
   [Unsplash](https://unsplash.com/) is a good source of high-quality free images you can download and upload to your site.
   :::

   ![Selecting an image from the library](https://kb-cdn.kualo.com/0b/4d/0b4d48b3cb1f45378f49869ed0b06158eb4d0659.gif)

5. Click the image you want to use so that it is highlighted.
6. Click **Select** to insert it into the page.

   ![Clicking the Select button](https://kb-cdn.kualo.com/bc/64/bc64356f06f791df9e4a683ca005dcc05b7e47fc.png)

Your image will appear on the page.

## Relocating images

To move a photo to a different position on the page, drag it to where you want it. For more detail on arranging content in ProSite, see [this article](/knowledgebase/prosite-web-site-builder/laying-out-content-in-prosite).

![Dragging an image to a new position](https://kb-cdn.kualo.com/7c/f4/7cf45be89d518cee8f257c8fe84af4b0a513903e.mp4)

## Resizing images

To resize a photo, drag one of the handles on the edge of the image to scale it.

![Resizing an image by dragging its handles](https://kb-cdn.kualo.com/27/4f/274f009b7f06b38b027c5400282882408d6f03f7.gif)

You can also set an exact size in the **Size** pane. The minimum and maximum size controls let you define how large or small the photo can appear across different screen sizes. We recommend checking how your photo looks on all device sizes after you add it, and using the min and max size settings to make sure it looks right on every device.

![The Size pane showing min and max size controls](https://kb-cdn.kualo.com/e2/01/e201485faaa9df37231ce52436ee49d4963e58a4.png)

## Cropping images

To crop a photo, select the cropping tool and adjust the visible area. Use the mouse wheel to zoom in and out.

![Using the cropping tool on an image](https://kb-cdn.kualo.com/a7/70/a770499e9bdf822ea02e3fe707518054201522e6.mp4)

If you want to display several images in a grid layout, see [this article](/knowledgebase/tips-tricks/laying-out-images-text-in-a-grid) for the best approach. Using a background image is often the easiest way to achieve this.

---

_Source: Kualo Knowledgebase — https://www.kualo.com/knowledgebase/prosite-widgets/how-to-upload-a-photo · © Kualo Ltd._