Custom components in markdown

Hello, I am new to JAMStack, so my question might be a little basic. Using Gatsby for example, how would I go about and add custom rendering to components with the markdown widget, as for example Medium has with generating embeds when people put in links to say youtube.

Is there a way that I could “encode” custom components/widgets inside of markdown for my editors? I would like to have these custom components inside of the editor.

Or would you accomplish this by using multiple markdowns and other items grouped together somehow?

I’m just looking for an example project or a guide of what I have to look into to accomplish this.

If you want your component to live insider your Markdown file, you may be looking for something like MDX (not supported by Tina yet). Alternatively, you could use our blocks field and store the data elsewhere, like a JSON file or in front matter.

Thanks! I’ll look into it.

As Scott mentioned, I think blocks will be the best fit for what you’re trying to accomplish! The mdx packages are not stable. You can reference Tina Grande for an example of how blocks are used to add page components.

Ideally, I like the idea of MDX, but from the front end perspective I think blocks are the way to go for now. MDX is nice because it doesn’t create any dependencies … kind of.

1 Like