Source code for the tinacms.org website.
This site supports shortcodes in Markdown content via remark-shortcodes.
Shortcodes must be written as React components. To add a shortcode, export it from utils/shortcodes.tsx.
export function MyShortcode({ textContent }) {
return <div>{textContent}</div>
}Call the shortcode in your content by writing the name of the component encased in double curly braces. Key-value pairs included in the shortcode will be passed to your component as props.
{{ MyShortcode textContent="Example shortcode" }}
Shortcodes must be standalone elements; "wrapping" shortcodes will not work.