Images not working in custom preview

[bradystroud]

Hi All,

When I use my custom preview, I cannot see relative images.
As shown in the image, when using images from external URL’s the images load.

Using the default previewer images work fine.

What is causing my image to not show up?

Thanks

[erez]

Hi @bradystroud, can you share the code of your custom preview template?

You should be using getAsset to retrieve the image URL:
See Creating Custom Previews | Netlify CMS | Open-Source Content Management System

[bradystroud]

Hi @erez,

Here is the preview template SSW.Rules/previewTemplate.js at main · SSWConsulting/SSW.Rules · GitHub

I’m having trouble loading the images from the body of the markdown that use relative paths.
How would I use getAsset in this situation?

When I disable the custom preview, I can see the image in the Network DevTools but with a different filename that looks like a GUID.
With the custom preview enabled I can see that it is looking for the image using the original filename and getting a 404. I am guessing that getAsset would get the filename that looked like a GUID, but how can I use getAsset to find all the images in the body?

Any ideas?

Thanks

[erez]

Hi @bradystroud, since you’re using markdown-it you’ll need to configure it to use getAsset. I think the way to do it is described here markdown-it/architecture.md at master · markdown-it/markdown-it · GitHub

[bradystroud]

Thanks @erez,

That solved my problem