# Blog

Writing blog posts is the main activity to start working on the SEO of your product, and write valuable content for your users or people potentially interested in your product.

Shipped provides support for MDX-based blogging.

{% hint style="info" %}
MDX is the Markdown for JSX syntax, you can learn more about it here <https://mdxjs.com/>
{% endhint %}

To create a new blog post follow these steps:

1. Create a new .mdx file in the folder `blogposts`
2. Include the following metadata at the top of the file

```mdx
---
title: "Blogpost title"
description: "Blogpost description"
date: "15 Jan, 2024"
slug: "blogpost-slug"
ogImage:
  url: "https://....jpg"
---
```

After the metadata, you can add the blog post content in Markdown format.

In this example, the blogpost will be available at `http://localhost:3000/blog/blogpost-slug`

### Images

You can use both absolute and relative paths for images.

Examples:

Absolute path: `https://yourhosting/image.jpg`

Relative path: `../blogpostsimages/image.jpg`

To use relative paths, you need to add the image to your codebase.

For instance, to use this relative path `../blogpostsimages/image.jpg` you need to place the file `image.jpg` into the folder `/blogpostsimages` of your project.

{% hint style="warning" %}
**Important**

The markdown file and the slug metadata, need to have the same value to properly work.
{% endhint %}

### Embeds

Shipped currently supports the following embeds: Loom, YouTube, and Tweet.

```typescript
<Loom id="loomVideoId"/>
<YouTube id="youtubeVideoId" width="100%" height="100%" />
<TweetEmbed tweetId="tweetId" />
```

### Image hosting

To start, I recommend placing the images inside your project.

If you are using Vercel to host your website (the easiest solution to get started), those images will consume some bandwidth, but if you don't have high traffic, you will certainly remain within the limits (100GB for free, 1TB on the $20/month plan).

If you prefer to use a CDN instead, you can use your favorite CDN solution (I use AWS S3 with Cloudfront for instance), but other alternatives are Cloudinary, and CloudFlare.

### Advanced&#x20;

Shipped uses the library [next-mdx-remote](https://github.com/hashicorp/next-mdx-remote) under the hood to parse the MDX files.\
For advanced customizations, please refer to the documentation of the library.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.shipped.club/features/blog.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
