images within markdown?

[waywardm]

is it possible to render images from within markdown

ie.

![Live Nativity](/images/livenativity.jpg)

so that these could be processed by gatsby like it does with general markdown files

using gatsby-transformer-remark with the files being hosted with the codebase

[jbolda]

It should be possible, but I think most of the markdown plugins assume these are files on a filesystem so I suspect it won't work perfectly as it stands. Have you tried anything yet? @brendanmc6 has been experimenting with markdown as of late.

[waywardm]

I have successfully pulled in markdown @jbolda but having issues with image url's in markdown

[waywardm]

https://www.insowerbybridge.co.uk/news/ is pulling from airtable as well as events

[waywardm]

Apologies, it does actually transform images through the markdown as shown at https://www.insowerbybridge.co.uk/events/live-nativity-2017, another error was causing these not to work. Because gatsby creates a node for the mardown elements in your airtable as well as markdown files stored in your codebase in your gatsbynode file you can't just use if internal type is MarkdownRemark on the createnodeField as it will try to create a slug on the airtable markdown nodes as well which in my case was throwing an error causing it not to build in production.

[brendanmc6]

@waywardm I gave up on this for the time being, and ended up using airtable to host my images by directly pasting the url into my markdown. I couldn't figure out a reliable way to reference local images in my markdown...

If I remember correctly, querying the images resulted in files with randomly generated filenames. Did you manage to figure it out?

[waywardm]

@brendanmc6 i did think it was working however I forgot it was just referencing images i had previously placed in a static folder, I cannot get it to process the images within the markdown itself. Instead i have created an attachment field in airtable and processed the images using child image sharp an example at the url https://www.insowerbybridge.co.uk/events/rushbearing-festival-sowerby-bridge-2018 to harness the speed of gatsby i always prefer for gatsby to transform the images if possible.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had any recent activity for 30 days. It will be closed if no further activity occurs within 7 days. Remove stale label, comment, and/or apply "ongoing issue" label to prevent this from being closed. Thank you for your contributions.

[jbolda]

We had a quick discussion in regards to this topic here (see thread above): https://twitter.com/jacobbolda/status/1171998973592264704

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had any recent activity for 30 days. It will be closed if no further activity occurs within 7 days. Remove stale label, comment, and/or apply "ongoing issue" label to prevent this from being closed. Thank you for your contributions.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had any recent activity for 30 days. It will be closed if no further activity occurs within 7 days. Remove stale label, comment, and/or apply "ongoing issue" label to prevent this from being closed. Thank you for your contributions.

[github-actions[bot]]

This issue has been automatically marked as stale because it has not had any recent activity for 30 days. It will be closed if no further activity occurs within 7 days. Remove stale label, comment, and/or apply "ongoing issue" label to prevent this from being closed. Thank you for your contributions.

[wahidshafique]

I tried using this plugin but could not get it to work with source-airtable. It seemed as if it already had transformed my airtable flavoured markdown to an href, turning

![hello](https://upload.wikimedia.org/wikipedia/commons/5/56/Tiger.50.jpg)

into

![tiger](
<a href="https://upload.wikimedia.org/wikipedia/commons/5/56/Tiger.50.jpg">https://upload.wikimedia.org/wikipedia/commons/5/56/Tiger.50.jpg</a>
)

[wahidshafique]

Leaving a comment here for posterity. After wrestling with this for a brief time I figured it out. I was using the wrong tool.

So I ended up changing over from remark to MDX by following this migration guide. After doing it all, I was able to injest all markdown images from airtable, however I needed to flavour them as html, so in airtable like

A Torus is a shape from geometry that is obtained by rotating a circle in 3D space <img width="400px" src="https://blenderartists.org/uploads/default/original/4X/b/6/f/b6f608dd5a39c6f4950da84fb8284564de4d3c2c.gif"/>