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.

1 Like

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.

1 Like