I’m developing a feature where a background image is combined with dynamic data from an object (such as text, images, etc.) to create a new, final image. In a typical environment, I would manipulate the DOM to render these elements and then download the resulting image. However, as far as I understand, DOM manipulation isn’t possible on Wix.
My question is: how can I generate this composite image using only the object data without relying on DOM manipulation on Wix?
Hi, @Desenvolvimeto_Foco !!
To manipulate the DOM in Wix, you need to use an HTML component (iframe) or a custom element. However, keep in mind that you cannot directly manipulate Wix’s built-in page DOM.
Implementing an “image composition” feature using only Wix’s built-in elements is challenging. However, by utilizing an iframe or a custom element, you can use a canvas to combine images and text. Additionally, you can allow users to download the generated image.
You can also use image processing npm packages on Wix’s backend (Velo) and send the processed results to the frontend. Alternatively, leveraging external APIs enables more advanced image processing and allows you to retrieve the modified images within Wix.
By combining these approaches, you can implement a feature that composes images on the frontend and allows users to download them locally. 