Blog Posts

This directory contains all blog posts as individual markdown files. Each post is a separate file with frontmatter metadata and markdown content.

Adding a New Blog Post

  1. Create a new markdown file in this directory: your-post-slug.md
  2. Add frontmatter at the top with metadata
  3. Write your content in markdown below the frontmatter

Example Blog Post Structure

---
slug: "your-post-slug"
title: "Your Post Title"
description: "A brief description for SEO and previews"
author: "Invoice Penguin Team"
publishedAt: "2024-02-15T00:00:00Z"
category: "Business"
tags: ["tag1", "tag2", "tag3"]
readTime: 5
featured: false
image: "/blog/images/your-image.jpg" # Optional featured image
---

# Your Post Title

Your markdown content goes here...

## Adding Images

**Example for "quote-vs-invoice" post:**

1. **Save your image file** as: `/public/blog/images/quote-vs-invoice.jpg` (or `.png`, `.webp`, etc.)
2. **Add it to your markdown** like this:
   ```markdown
   ![Quote vs Invoice comparison](/blog/images/quote-vs-invoice.jpg)
   ```

General rules:

  • Where to put images: Always in /public/blog/images/
  • How to name them: Use the same slug as your post (e.g., quote-vs-invoice.jpg, how-to-write-a-quote.jpg)
  • How to reference them: Use /blog/images/your-image-name.jpg (note: /blog/images/ not /public/blog/images/)

Images will automatically be styled with rounded corners and shadow.

Frontmatter Fields

  • slug (required): URL-friendly identifier (e.g., "how-to-write-a-quote")
  • title (required): Post title
  • description (required): SEO description and preview text
  • author (required): Author name
  • publishedAt (required): ISO date string (e.g., "2024-02-15T00:00:00Z")
  • updatedAt (optional): ISO date string for updates
  • category (optional): Post category (e.g., "Business", "Invoicing", "Templates")
  • tags (optional): Array of tags for categorization
  • readTime (optional): Estimated reading time in minutes
  • featured (optional): Boolean, set to true for featured posts
  • image (optional): Featured image path (e.g., "/blog/images/post-image.jpg")

Markdown Features

All standard markdown is supported, plus:

  • Tables (GitHub Flavored Markdown)
  • Code blocks with syntax highlighting
  • Links (internal links use relative paths)
  • Images (automatically styled)
  • Lists, headers, emphasis, etc.

Internal Linking

Link to other blog posts: [Link text](/blog/other-post-slug) Link to pages: [Link text](/quotes) or [Link text](/create)

Testing

After creating a new post, verify:

  1. The post appears on /blog
  2. The post page loads at /blog/your-post-slug
  3. Images display correctly
  4. Links work properly