Welcome to md2html-action Documentation
This comprehensive documentation demonstrates the full capabilities of md2html-action, a powerful GitHub Action that converts Markdown files to beautiful, professional HTML with multiple themes and templates.
Explore our comprehensive documentation:
- ๐ Getting Started - Learn the basics and start converting your first Markdown files
- โ๏ธ Advanced Configuration - Discover advanced features, custom templates, and styling options
- ๐ Examples & Use Cases - Real-world examples and implementation patterns
- ๐ง Troubleshooting Guide - Solve common issues and debug problems
๐ Quick Start
The md2html-action works with pure vanilla Markdown - no frontmatter or special setup required! Just write standard Markdown and let the action handle the rest.
โจ Features Being Tested
๐ Code Example
Hereโs a comprehensive Python example showcasing syntax highlighting:
import asyncio
from typing import List, Optional
from dataclasses import dataclass
@dataclass
class User:
"""Represents a user in the system."""
str
name: str
email: int] = None
age: Optional[
def greet(self) -> str:
"""Generate a personalized greeting."""
return f"Hello, {self.name}! Welcome to md2html-action."
async def process_users(users: List[User]) -> None:
"""Process a list of users asynchronously."""
= [user.greet() for user in users]
tasks = await asyncio.gather(*tasks)
results
for result in results:
print(result)
# Example usage
if __name__ == "__main__":
= [
users "Alice", "alice@example.com", 30),
User("Bob", "bob@example.com"),
User("Charlie", "charlie@example.com", 25)
User(
]
asyncio.run(process_users(users))
๐ Feature Status
Feature | Status | Notes |
---|---|---|
Markdown Conversion | โ Working | Full Pandoc integration |
Default Template | โ Working | Clean, responsive layout |
Minimal Template | โ Working | Lightweight styling |
GitHub Template | โ Working | GitHub-like appearance |
Academic Stylesheet | โ Working | Professional academic styling |
Technical Stylesheet | โ Working | Modern tech company design |
Blog Stylesheet | โ Working | Personal blog styling |
Corporate Stylesheet | โ Working | Professional business design |
Table of Contents | โ Working | Auto-generated navigation |
Code Highlighting | โ Working | Syntax highlighting support |
Math Rendering | โ Working | LaTeX math via Pandoc |
Responsive Design | โ Working | Mobile-friendly layouts |
GitHub Actions CI/CD | โ Working | Automated testing & deployment |
Demo Gallery | โ Working | Interactive theme showcase |
Custom CSS Integration | โ Working | External stylesheet support |
๐ Available Themes
The md2html-action includes 6 professional stylesheet themes:
๐ Academic
Perfect for research papers, theses, and academic documentation. Features traditional typography, proper citations, and scholarly formatting.
๐ป Technical
Modern tech company design inspired by Stripe, Notion, and Linear. Features Inter fonts, gradient accents, and clean layouts ideal for API docs and developer guides.
๐ Blog
Personal blog styling with comfortable reading typography, engaging layouts, and social media integration hooks.
๐ข Corporate
Professional business design suitable for company documentation, reports, and formal communications. Clean, authoritative styling.
๐จ Default
Clean, responsive layout that works well for general documentation. Balanced typography and neutral color scheme.
โก Minimal
Lightweight styling focused on performance and readability. Perfect for simple documentation sites.
๐ฑ Responsive Design Example
All themes are fully responsive. Try resizing your browser window to see how the layout adapts!
Device Type | Layout Features | Key Benefits |
---|---|---|
๐ฑ Mobile | Single column layout | Easy thumb navigation |
๐ป Tablet | Flexible grid system | Optimized touch targets |
๐ฅ๏ธ Desktop | Full-width layouts | Floating table of contents |
๐ Navigation
๏ฟฝ Documentation Navigation
Explore the complete documentation:
- ๐ Getting Started - Learn the basics and start converting your first Markdown files
- โ๏ธ Advanced Configuration - Discover advanced features, custom templates, and styling options
- ๐จ Demo Gallery - Interactive showcase of all available themes and templates
๐งฎ Math Rendering Example
The action supports LaTeX math rendering via Pandoc for technical documentation:
Inline Math
Einsteinโs famous equation: \(E = mc^2\) demonstrates mass-energy equivalence.
Block Math
The fundamental theorem of calculus:
\[ \frac{d}{dx}\left( \int_{a}^{x} f(t)\,dt\right) = f(x) \]
Complex equations with matrices:
\[ \begin{bmatrix} a & b \\ c & d \end{bmatrix} \begin{bmatrix} x \\ y \end{bmatrix} = \begin{bmatrix} ax + by \\ cx + dy \end{bmatrix} \]
๐ฌ Blockquote Styling
Pro Tip: The md2html-action is designed to work with pure vanilla Markdown.
You donโt need any special setup, frontmatter, or configuration files.
Just write standard Markdown and the action handles everything else!This makes it perfect for documentation that needs to be readable both as
Markdown source and as rendered HTML.
๐ฏ Advanced Features
Task Lists
Code Language Examples
JavaScript/TypeScript:
interface User {
: number;
id: string;
name?: string;
email
}
const users: User[] = [
: 1, name: "Alice", email: "alice@example.com" },
{ id: 2, name: "Bob" },
{ id;
]
const activeUsers = users.filter((user) => user.email !== undefined);
Bash/Shell:
#!/bin/bash
# Install dependencies
npm install
# Run the md2html-action locally
npx @actions/core
pandoc --version
# Convert markdown to HTML
pandoc input.md -o output.html --template=template.html
YAML Configuration:
name: Convert Markdown to HTML
on:
push:
paths: ["docs/**/*.md"]
jobs:
convert:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: CameronBrooks11/md2html-action@main
with:
source-dir: "docs"
output-dir: "html"
stylesheet: "technical"
๐ Performance & Compatibility
Aspect | Details |
---|---|
Build Time | โก Fast conversion using optimized Pandoc |
File Size | ๐ฆ Minimal CSS/JS footprint |
Browser Support | ๐ Modern browsers (Chrome 88+, Firefox 85+, Safari 14+) |
Mobile Support | ๐ฑ Fully responsive on all devices |
Accessibility | โฟ WCAG 2.1 AA compliant |
SEO Friendly | ๐ Semantic HTML with proper meta tags |
๐ Conclusion
If you can see this page properly formatted with:
- โ Professional typography and spacing
- โ Syntax-highlighted code blocks
- โ Responsive table layouts
- โ Mathematical equations
- โ Interactive table of contents
- โ Smooth navigation between pages
Then the md2html-action is working perfectly! ๐
Ready to get started? Check out the Getting Started guide or dive into Advanced Configuration for power-user features.