Skip to main content

Render Image from URL Field in Data Group

Intro​

Now, you can easily include images from URLs in their Data Groups on the web app. This feature allows for seamless integration of diverse visual content, enhancing user experience and expanding data sources. Simply input the URL, and the image will be rendered within the designated Data Group, enabling dynamic and visually engaging datasets.

In this video tutorial you will understand how to render any image from the URL in a Data Group to create visually-stunning web applications.

1. Create a Collection​

Create a collection for Image URL. For this go to Collections and click Add Collection. You can even use an existing collection. Choose URL option, give a name to this field and click Save.

DrapCode Builder Create New Record

2. Drop a Data Group​

Go to Components and drop a Data Group. Here select the collection from which to fetch data and Save this setting.

DrapCode Builder Create New Record

3. Preview the Images​

Bind unique fields of the collection to the Data Group via Settings. Then Save the selections. Then go to Preview to view the images/changes.

DrapCode Builder Create New Record

Conclusion​

One significant benefit is the seamless integration of diverse visual content, enhancing the user experience and enabling dynamic and visually engaging datasets.