---
title: Photos in Connect
description: This tutorial walks through different ways to use photos in Connect.
---

[Skip to content](https://go.screenfeed.com/portal/photos-in-connect#main-content)

![Screenfeed Logo\_White (1)](https://go.screenfeed.com/hs-fs/hubfs/Screenfeed%20Logo_White%20(1).png?width=300&height=63&name=Screenfeed%20Logo_White%20(1).png)

Open main navigation

Close main navigation

 Hello how can we help you?

- There are no suggestions because the search field is empty.

1. [Portal](https://go.screenfeed.com/portal?hsLang=en)
2. [Connect](https://go.screenfeed.com/portal/connect?hsLang=en)
3. [Widget Walkthroughs](https://go.screenfeed.com/portal/connect?hsLang=en#widget-walkthroughs)

# Photos in Connect

## This tutorial walks through different ways to use photos in Connect.

<iframe width="256" height="144.64" src="https://www.youtube.com/embed/lDp2Oie4eu4?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen title="Connect Tutorial:  Photos" style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border: none;"></iframe>

#### Photos in Connect

There are several ways to add photos to your connect app. Consider the following before choosing a method:

- Do you have photo files you want to upload?
- Do you have any photo hosting services?
- Do you need your app to update photos automatically?

### Method 1: Choose from the library

Select the photos component from the left menu. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c78e0f240c274e4e4f7_ulVThFXUd5CJxD_sF3XqqEgRzjzR8paHIaoVUR1GIrpfIo4kOdmZ87nxLVULuH5Lo2hx_2sNrR-tkIEqctipOPG4usXiffeco-73Un1hgMOJrUwHOcqd6uGFFpAd3UTTLq8IdrTD1zE_0hdfqxCz198.png)

Type into the search box to browse through a large variety of royalty free photos from Pixabay. Keep in mind that the term you use to search will give you the best results. For example a search for “Cereal” will have different results than “ Cereal bowl”. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c799b2e2603681bab89_Vv4zBX4vtuybu6lqaQoxD-IQ140us1Lh9srZq90GlCRflNUtAi6f_yT15nDZgY8gR3eOa-xbpTRoQgCZ4ZK4raw_P2agyw01bl-I3TVe8u9J1SFUXCObdq9Sp3ZFjclOo8oxDK1rjjJ4fnB3rWiuQ-A.png)

‍

Once you have found the right photo, click and drag the photo into position on your app.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c789fdf858d36dc84a6_M25bqlIA-zRybMdsoLsSraA3w3LPjLHkUKhLiAomQQJqw7WiVCReRiKL7VJJNLDPTE4rvwx6XOMp8tElzNvvszXaB3uGMpp27wYaXfRAv2-9UvkXbPvWCw8MDJh4J_cBFTHhRjMAtU-NkTLY0mUCNVc.png)

### Method 2: Direct Upload

Select the photos component from the left menu and click on the Upload Photo Button at the top. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c789137084c5fe50b7e__K_YPDYyL-WIHuhxwuBGGLsQZEWBEULF7h1lpLxiHHeThgGxLFgiBbk3bb778D4X0OYOUCDfLId9FtH4_vayqcIGpqYIErAcSYfu_NfjNDrb3W0rLwDK6J0gqld7rcg8OutljMJ_v6D6PSg9cycXWhg.png)

A window will appear where you can choose your photo source. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da0901c95dab02a419_rL6yw5pviY_D42xlJvlzLfq-Pq-3MeMKNCZo64gpJhlPtJG_PMPehEoBUuheIYr14MHHiUMKwJUBx30Xk23AGfLfN18kC5_-9XwBl1HuhlRRB9GMaBjfXX6VOgjgmM59wVIKb1Eziyiv_TKMmcNfByVQaJKbHaCVQAcNgAWE6GM4-vGGk3lzmjhaG3bl.png)

‍

**My Device** will upload a photo from your computer file system. Select the files you want to upload then click the Open button.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76db4c77740d0963d97e_wMbVym_BAuPckMgrNTXMVF8lyRleF_1u4aznWu06S5fX6AioxDbD1NmOa4eXhieaF2u28mXKzpBR8rkIDkz5OGVZRZOCxr1zot7RC9ogzpSg4p5YxazkdkluV58FeadAcPm7ZZbHrz7NfjeEbKW0C8k3wjkdfSkenhkn8wlDOscEoBdf11YC7ufwFTGkOg.png)

**Camera** will take a picture using the camera on the device you are using to edit the app. (You will have to allow access to the camera on first use)

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da36e0f99ff6a51c41_5zZsk48TfjsfxjPuqVrmZVxy2b5BtFauGT4C2S-8vZ5dmdbk-b9BhcJp_PxySanYYCfWgzK-kD3X3q90EVAQM2yzIHB0cg8MbX1mKfJExZIqc3ZIYsTtIHxVEiTJD4GIiqxARr7zimvgDeYrKavSYu7ZfXDmZjBG_AFrL6NxnWfLSHslWX1YDuOGUSWb4A.png)

**Link** will present a field for you to enter a link where your photo is available online.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76daddf0764d2a157973_26fPLJ81dxDqtbsjzznTSSBVNs0BU0adFskeKfvnnUnDQajwl3xCMZfVGMqu2Zqq1V-IhBVsemzp4C3gOQEpckvAjTdWlEocnq3zVICti0oRrAuwU7Wz1BFtjLCkxmh2OLAQxQ7HR1kgRmEkF1B-3_5FxelChPfwxtyGQAk95sEXdYMzzV5oNBY7qwDfpA.png)

‍

After you have chosen to upload a photo, you will be directed to the upload manager screen. You can choose to upload the photo or photos.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da0e1bd21a78a62ebd__wpGuC2xHEsXnS8tfX61RsUHP-Hs5RISI5qKLlor-PvqL5PhG2068k3fns9m1r25aGOITuUTIUR0sgYD-u18FY9dU7tWjjvNBVLZCa9GjC7FAuWkm9905g5QaztBlN3enXmWOtPoEdcWPehBwBuMte96KvgC_rBEaTrmm7eskZ4XdpxyqZjPYsT6x-DlMw.png)

Click on add more in the top right corner to add more photos from the same or a different source. If you add more you will return to the upload manager, where you can choose to upload the selection of photos. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da4bdb117738428ce8_KuxZwDq-1j-W59U41rPZhhYkj5JQhCJSNeDrJn8U7kUcxJqGqQwV8HmJNTaQDyC4FpuIamuoS1nf5_Feiik5mcInJ6aMaTjBP55OPIkacIqeulVjsmZoc2XDUY0Pv5n_k0LK6_3MIADWOhV8f5q9TLd6lRMelTRX4vxeI7KFImqgtQkuHwHGPQ57iZ0VTg.png)

Once you click upload the photo or photos will be placed in the canvas.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76dbfd2b2c52117f8156_jceHzKPMkv_xDUBXl1dQpsMvf07_IS5LfSA82jrsF25ceUZMNwN8RsGLHCDSMHzeDpa04zDpaSy3ueIiY5SNst04VC7yrHSXu0ePzMqVjegzrMm-Wu1G8sUk2he-9PkXwMq7RM6O70t5dUMiauYrKbmjWbF4grHfoJ0Tw4xxzmA-KY-Huiv1Bop959aVtQ.png)

 

You can see the images you uploaded by clicking on Photos in the left menu. The saved images will be visible for everyone who has access to your account. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c797f50cb0c2e45ccc6_CfI4G9_rlN-jOqbCFI4ksuVSS0pYbzoFhWYhzL8FPV50TpAyuZpP8J4R_6U5l-ahpUxY_UTGfRC7Q1bthD85UDmp89UbzF7S-a7b60CnA5DkTx41OZ4MKyONfpZzH_KU3iPulrt26jW849OrQ5IoRl8.png)

Click on the edit button to remove images from saved images. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76dabdf3c591ff64caa5_jQ0j8CIP-aqE7YEwKsLFjswaADk4tNjoJNYij4fy4EWe56qmkZ02gKLPrKZNdOdedzIZRq32YYkX2to8FxsPszWwtZiIXt40nqFwE4AJ7DXPkEbGeTy76ZFBm_EKvDKpttwFdEZtbk87hfQEextQR5WCrzGm8gEZcZO8uboD4XcpOJm70kTeWgydfaf3wA.png)

Click on view more below the images to see more of your uploaded images. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da3d7b9733e22aa427_PIbfp3uNCGSpigmNogccfPsYbyEMfOQBlQNr6H_y2XujbtzaAf0yo2yfZ0ophE_Qn0k1ni2wDvhOKFuiovMr5w-GyFiXcKonskXk2wCopzNOHwVBCMLSSF89_XLdtrVLT9gctZDqYMLU876lK-ULYq5N26Su8YAT3HptJwuG-vaaXtN_hKhVWNa9JIYxGw.png)

‍

### Method 3: Upload Multiple photos to a Manual Table

Photos can be added to a table for use in your app. First Create a manual table data connection. Click on Data in the left hand panel. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c790a709093e7d44997_8G2rgrdP1QzPi-nVb3fugX15SKZ0J1MlxO0IjJDl5xvA-uXDHr2Q-Vd-ZGxMyh0mgihC2MPFs_phL3VoM6A7Y21oCsOD9Oj7o8tJHnEyzyBAKU0b4vU_fhlKSRRmYLaxtCmEql646GxRGkSVnd8Od8A.png)

Click on Create a Connection. Then choose Create a Table. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a81058e497d757341_b26TG5EzSIWSPmW5jx1mjSS2a_h62w4EJdonDwUL9xCYJwzKnFlhVFx2paLCtbbVaaTiWGhIE9zSznJfF8T39wfbNrQuVfCZvbQAkxyOJHoaB5YQLIMaMqr2nmNSeIHg2Kb3F9Y-hldv2EyuXWfyKhk.png)

Choose Image Upload for the Column Type. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a8a70b8e7b512c110_YgU4HAp8Gh-X-aSNVjw0frE2bPL3fntiA-DTodyibOUTxCGKZ2gY7Pvc_JNyPgrU9Fn8zo-p19ctM60aaJS-NwGCfy5uuN4obPnUtwYqc_cIzHuwPiZUmIkF19I73kfgZDkYkaQ6i2h9-QYE8SDnZLc.png)

Click Continue, Then name your connection. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7aca8dcee4603228aa_TdolVfRB0fNv_ym-fZD7czVWhKWoflw0bMiAy9VWgh80IiywRIom3gV-ws9ZP8ApKi4KPD4Hh3ESwZnMj9YRpzDeJqWbfBwJkjq7ixJWjll9QEGVkfv-NCoQ_xH55FmW5k4E6Clvm4Ff_qmPrbZPZng.png)

Click Continue then edit your data.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a1dcf2a29a36dfb5a_ZBytKEzgEpm5lV_WwSgucHT6AVLcono2Fa77NVpnkAZvgk7IAONdsbbVSz9nYodpt3QKZb0K_Lwj5y-VGu-TcDb-WapMl7wcjaweYASKfxtXLyLuqTZVDImIFRjzQdxyJBDmifCzsoSnSK78T3dSuXs.png)

Click the upload button to upload your first photo.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7aca2e587418102b59_7dlgukRW8vnohxTI0aT1vvVCRHMO5HvCkJ5K6TY8EAPl6Z17xQthFdOF6e59BxXgAwjZMmEjoL_eu2jRJ6toB3hsnkR_rMLpleoZ3sMEvwYTXUw2c-rcdNNeLC0OZuFrGL3nxmyCRzEJjzvNPwSlaUU.png)

The photo upload modal window will appear.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a40a64ba7e57ce34c_T3gbRIY7pV1Nsi1WmebjfAhVMzNftPWe62ABWcYalIRGLyNY4H9OUibGR_loCo5egM8Og0rRLajxKsPNg9iYzPjl_5gCbdfah4FOAMtvLvcTz6AqLjSXNNWxMNu9mD35uYFvQ9WSD3RtBkKH50BnheA.png)

Choose your photo then click upload

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7afb873ba144c37429_zJK0DMe9AkSKfkNEqqpCb0RmGRovgYasNO28BhjSRiwwzqZtCiHiHhnXPo2CMLTixxywoVEEvazq1lTZPxiaRTE2jRSKXmzUofNFpaV4D9YoPiviERFu2Um984tVZbTe_ymPoD16neFDBKIJju-1wLw.png)

To upload more photos click the + button below the first record. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7accce7dfa897ced70_lgLT5Zyf6JPv2kRPUFqzumpjugjlJt-GlLEVo7-NrmFldZ4in6HQUFwLHyG4FaEoXdoYPcJWph74BgHDeDDD61_zY_7fnGvM_IN1VjSPApiFDSYHK0NSr9ElGLhF6abG_RNlt_LPkIJOcVwrboqiU2s.png)

Click on the arrow next to the record number to re-order insert a row or edit the row. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a9b2e2603681baf06_r-kkzzzDgc5PzdZlwqg_AyxeYhkxnNdtb50HgRnDcCnMAg-vCZ9ofDoAoIEBLe6d0hytCEhK_utM4JG1dPgXab7GdWp1E4buKMngBHtzXbuXK1mrT6Txsm5TtACT4JTGWMJnjHnj1-E7ew6QR6_SOuk.png)

Click on the record and you will see the option to replace or remove the photo on the right side of the window. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a4fbbfd1f5ef33c8c_n6Y-JjlJn0kxyMbIeukUk6pqisO4FYaXzYYo59blnLBQ0gS2j8zU0Olbfhxlr4Y7eEOT0t_oIlsmADAlSWY6SO_u-Y7_NcFdW5Qwjf2Mn3SaSPpjg4pPeUWgZHGQ1MX9o-qd_6GZ8P7H7vlIvpUAGRM.png)

After uploading your photos click save Changes.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a81058e497d75746f_WzdpvV_2Yt0zK3G3uTc2VwuOyUGEvgRLFc3sPGWWFY1RouVZ609LrkK1Nf6CL_CIZknr2iUMiZWJhN0IqZHi_FiFIIa1BAfGpB3W6ctZEdJoxGTlvWNcmJ8eOVT-34ZEEqQEUBFILTNMiFmxzmvybnA.png)

### Method 4: Photo Links from a Connected Data source

Photos can be added to an app from a connected data source. The advantage of this method is that photos can update independently from the connect app. For example photos from a google sheet can be replaced by simply changing the link in the spreadsheet. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/636a76da61e0e4eca8f7fc32_516yg8r3Gc8vE6r2vqyQV0PAePBn50S8ET7RMQQPWZxZaBtEkpRSSnC9kzgNUFp9nTNE-fI6laKFQ67box0q8eQB6jbLTwIz-E_eztOimsojshwyPac67LgCwNBxbQ6SNHVB20aheQ_TinbtU2_fZ_uMtx3THgnL2-Lh7AyMpGlSvXpBTO0deTfOAVQ-ow.png)

‍

This method requires a data source with photo urls. For example a spreadsheet, either google sheets, excel or csv, filled with links to hosted photos. Once the data connection is established photos can be dragged and dropped onto the canvas as a single data value or as a part of a repeating grid.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7a46715848c6890b87_8NniWspOKFj3PYQClZqIepcwKigZr55vHRsTuQ0RIPC6XTizfPySaP5I3oC39-6Q535BRfcOy8e6idy1fB6RS8YsNzlK_sGRGDIX3ULm7UW3Xm_lb0LIHwkujTk68FGwjyYKWEKK5kvZmFKR8BQ3Bf4.png)

Follow this link to learn more about creating an app with data

### Placing a photo in a shape

You can use a shape as a frame for your photos. Add a shape to the app builder canvas. Then drag a photo into a shape and it will fill the shape.

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7b60d3ee520d33f7e4_IRPKcXtkhsUyw6LUSmSc_zxWyp4kHojTgNwhvRVdQ0y7V2sqHcxFoxz4MkRdLrY50gS5cdu7kEe2fexWq2FndvM6Dnkf9RNSdFBv2-0am1tuK342A0GZm8HN0njHrS8ojjQ8xF7XLEFufXAwsbhViHg.png)

‍

Images can be removed from shapes by selecting the shape and clicking on remove image from the properties menu on the right. 

![](https://uploads-ssl.webflow.com/61a49075fd3a7af706d0fa22/649c5c7bccce7dfa897ceea0_uMfJtaZD9iPBOBx_9MSw5n3Z2vg8ZFK0UqNnSRzflTgDaYFqjbIFtg5Zb1PxiMQ3eRLPdccMOUmG0jdg0GTl3l-HR7wrrkD4WUU6M7bWqqJWsj_7Fgide-siWhCPyNJmzYIAi_FvZ4FsQVqvG-hXN20.png)

‍

‍

### Next Steps

Not sure how to start? Get inspired [Using pre-built Templates](https://go.screenfeed.com/support-articles/using-templates-in-connect?hsLang=en)

Learn how to connect your data [Connecting your data](https://go.screenfeed.com/support-articles/managing-your-data-connections?hsLang=en)

‍

### ‍

 

screenfeed.com

Copyright © 2025, Screenfeed