How to add your first MDX blog post on Shipixen
Quick Answer
Create a new MDX file in your Shipixen project's blog directory with proper frontmatter and content. Configure the metadata and publish your post through Shipixen's built-in blog system.
Prerequisites
- A Shipixen project set up and running
- Basic knowledge of Markdown syntax
- Access to your project's file system
- Text editor or IDE installed
Step-by-Step Instructions
1
Navigate to your blog directory
Open your Shipixen project and locate the
content/blog or data/blog directory in your project structure. This is where all your MDX blog posts will be stored. If you can't find the blog directory, check your Shipixen configuration file for the correct content path.
2
Create a new MDX file
Create a new file with the
.mdx extension in your blog directory. Name it descriptively, such as my-first-blog-post.mdx. The filename will typically become part of your post's URL slug. Use lowercase letters and hyphens instead of spaces for better SEO-friendly URLs.
3
Add frontmatter metadata
At the top of your MDX file, add frontmatter between triple dashes:
---
title: "My First Blog Post"
date: "2026-03-18"
description: "This is my first blog post on Shipixen"
tags: ["tutorial", "getting-started"]
author: "Your Name"
--- Make sure to use the exact date format and include all required fields specified in your Shipixen theme.
4
Write your blog content
Below the frontmatter, write your blog content using MDX syntax. You can use standard Markdown elements like headings (
# ## ###), paragraphs, lists, and even embed React components if supported by your Shipixen setup. Take advantage of MDX's ability to include interactive components to make your posts more engaging.
5
Preview your post locally
Run your Shipixen development server using
npm run dev or yarn dev in your terminal. Navigate to your blog section in the browser to see how your post appears before publishing. Use hot reload to see changes in real-time as you edit your post.
6
Configure post settings
In Shipixen's admin panel or configuration, verify your blog settings are correct. Check that your post appears in the Posts section and that the metadata displays properly.
7
Publish your blog post
Once satisfied with your post, commit your changes to your repository. If using Shipixen's deployment features, push to your main branch or use the Publish button in the Shipixen interface to make your post live.
Always double-check your post on the live site to ensure formatting appears correctly.
Common Issues & Troubleshooting
Blog post not appearing in the post list
Check that your MDX file is in the correct directory and has valid frontmatter with required fields like title and date.
Frontmatter syntax errors
Ensure your frontmatter is properly formatted with triple dashes --- at the beginning and end, and use proper YAML syntax for all metadata fields.
Images not displaying correctly
Place images in the public directory and reference them with absolute paths like /images/my-image.jpg in your MDX content.
React components not rendering
Make sure you've imported any custom components at the top of your MDX file and that they're properly configured in your Shipixen MDX setup.
Prices mentioned in this guide are pulled from current plan data and may change. Always verify on the official Shipixen website before purchasing.