Skip to main content

Markdown Render

The following is an example for rendering markdown messages. It leverages on the Markdown Renderer Plugin, which is maintained separately on the React ChatBotify Plugins organization. If you require support with the plugin, please reach out to support on the plugins discord instead.

Live Editor
const MyChatBot = () => {
	// loads markdown renderer plugin to be passed into chatbot
	const plugins = [MarkdownRenderer()];

	// example flow for rendering markdown
	const flow: Flow = {
		start: {
			message: "### Hey there, feel free to send me a markdown message!",
			path: "try_again",
			renderMarkdown: ["BOT", "USER"],
		} as MarkdownRendererBlock,
		try_again : {
			message: "Interesting, **give it a try again**!",
			path: "try_again",
            renderMarkdown: ["BOT", "USER"],
		} as MarkdownRendererBlock,
	}
	
	const settings = {
		general: {
			embedded: true
		},
		chatHistory: {
			storageKey: "example_markdown_render"
		}
	}

	return (
		<ChatBot plugins={plugins} settings={settings} flow={flow}/>
	);
};

render(<MyChatBot/>)
Result
Loading...