blsmedia/bot
2
0
Fork 0
Code Activity

📝 (blog) Improve Image MDX component

Browse Source
This commit is contained in:
Baptiste Arnaud
2024-04-22 19:47:43 +02:00
parent ccc974f5f9
commit 5fb20e36eb
7 changed files with 29 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/docs/contribute/guides/blog.mdx
View File

@ -37,11 +37,11 @@ summary: 'A short summary of the blog post.'
By default the og image is generated from the title of the blog post. If you want to use a custom og image, you can specify a `image` field in the frontmatter.
All images need to be placed under the `public/images/blog/<POST_FILENAME>` folder where `<POST_FILENAME>` is the name of the mdx file you are creating/editing.
All images need to be placed under the `public/images/blog/<POST_FILENAME>` folder where `<POST_FILENAME>` is the name of the mdx file you are creating/editing. The image file name should be in lowercase and separated by `-`.
Here are all the components you can use in your blog post:
- `Image`: To display an image. Example: `<Image src="/images/blog/my-awesome-blog-post/image.jpg" alt="My awesome image" />`
- `Image`: To display an image. `width` and `height` props are required and must match the actual size of the image. Example: `<Image src="/images/blog/my-awesome-blog-post/image.jpg" alt="My awesome image" width={800} height={600} />`
- `Callout`: To display a callout. Example: `<Callout status="info">This is an info callout</Callout>`. You can provide a `status` prop with the value `info`, `warning`, `success`, or `error`.
- `Tweet`: To embed a tweet. Example: `<Tweet id="1234567890123456789" />`
- `Typebot`: To embed a typebot as a Standard component. Example: `<Typebot typebot="<YOUR_BOT_PUBLIC_ID>" />`. You can provide the same props as the [Standard component](../../deploy/web/libraries/react#standard).