Connecting external database to pro gallery

I have successfully connected an external database running on Azure. I can use the UI data connector to connect to repeaters, tables etc.
I saw that the external DB connector is converting the DB fields automatically for Wix.
The problem or what I`m looking for I need to have a field with type image to connect to a pro gallery. How can I achieve this with an external connected DB?

I know I can populate the pro gallery with wix dataset and code but this is not what this question is about.

Hi there,

To connect an external database field of type image to your Pro Gallery in Wix, follow these steps:

  1. Fetch Data Using Code:
    Enable Dev Mode in your Wix Editor.
    Use Wix’s fetch or axios to retrieve image data from your external database.
  2. Map Data to Pro Gallery:
    Once you have the image data, use code to map it to your Pro Gallery.

Here’s a basic example to get you started:

import { gallery } from 'wix-data';

$w.onReady(function () {
    fetch('YOUR_API_ENDPOINT')
        .then(response => response.json())
        .then(data => {
            let images = data.map(item => {
                return {
                    src: item.imageUrl,
                    title: item.title,
                    description: item.description
                };
            });
            $w("#myGallery").items = images;
        })
        .catch(err => console.log(err));
});

Replace YOUR_API_ENDPOINT with your actual API endpoint URL.

  1. Update Gallery Items:
  • Ensure your Pro Gallery ID in the code matches the one in your Wix Editor (e.g., #myGallery).

This approach ensures your Pro Gallery dynamically displays images from your external database.