Image src path in html code

Ask the community
,
1

Hi Wix team,
I’m creating a website with a html widget window added in one of the pages. For the html code, I’m copy pasting the code source… unfortunately the images in it do not display… I’ve also uploaded the images in the html file to the site media seperately.
I would like to know what img src path needs to be given for the image to appear with in the window.
Thanks.

2

Hi Mahesh. I have used the html element too, and use images from my WIX upload. If you get an image url (right click in the manager for example) you get something very long. Some where you will see “.png” (or jpg or what ever image file extension) and then it continues with more characters. Currently I trimmed away everything after that first image file extension and it works. Oh, I did click on the preview of my image to have the same size as the initial size. It can be that otherwise you get thumbnail images. I didn’t check that.

3

Thanks Edgar. Didn’t think about right clicking on the image, uploaded in the media and clicking on ‘Inspect’… I’m now able to get the img src path and after changing it in the code in the html component, the image gets displayed…
One drawback in this is, all the uploaded image has its own name set… if only that part of the path before the image name is unique, then it would be easiet to ‘find and replace’ that part in the html source code and later upload it to html widget… this method would have been even more better, if there are lots of images in the html file.
Anyway I will now be able to get the images loaded.

4

Hi Kapil

I am trying to postMessage an image to html from my database but unfortunately i am not able to do so.
They only way it display image is if the url of image is external.

Can you share sample of your code?

Thanks
DA

5

Andreas posted source code for this long time ago, no longer worked, I adapted it. Can not find it any more on this forum, so I paste it from my project:

export function getFullImageURL(imageSRC) {
 //convert the wix:image url to something that can be displayed inside html-component
 let strReturnImage = "";
 if (imageSRC.startsWith("wix:image:")) {
 let wixImageURL = "";
        wixImageURL = "https://static.wixstatic.com/media/";
 let wixLocalURL = "";
        wixLocalURL = imageSRC.replace('wix:image://v1/', '');
        wixLocalURL = wixLocalURL.substr(0, wixLocalURL.lastIndexOf('/'));
        strReturnImage = wixImageURL + wixLocalURL;
    } else {
        strReturnImage = imageSRC;
    }
 return strReturnImage;
}
6

this technique works for me

7

Old post closed due to spam comments.