Markdown Mobile Export

Use when a task needs a local Markdown file path or pasted Markdown text converted into a faithful mobile-friendly PNG/JPG long image for phone-readable arti...

Faithful Markdown → mobile long image, no content rewriting.

When to Use

• Local .md file → phone-friendly long image
• Pasted Markdown text → PNG or JPG
• Article-style faithful export (not poster or carousel redesign)
• Intermediate HTML needed for inspection alongside image

Do Not Use

• Poster redesigns where content should be rewritten into marketing blocks
• Carousel slicing across multiple images
• Rich web app UI design work
• PDF output

Quick Start

bash

# From file
python3 {baseDir}/scripts/markdown_to_long_image.py \
  --input-file /path/to/file.md

# From pasted text
python3 {baseDir}/scripts/markdown_to_long_image.py \
  --markdown-text "# Title\n\nBody"

# Custom output path and format
python3 {baseDir}/scripts/markdown_to_long_image.py \
  --input-file /path/to/file.md \
  --output-image /path/to/output.png \
  --format jpg

Defaults

Aspect	Default
Input	Markdown file path or pasted text
Output	PNG long image + HTML sidecar retained on disk
Style	Faithful conversion, mobile-first, zh-CN typography
Width	820px card layout with warm earth-tone theme
Browser	Local Chrome/Chromium/Edge/Brave → Playwright fallback

Workflow

1. Resolve input (--input-file or --markdown-text)
2. Normalize pasted text into a concrete .source.md file when needed
3. Render mobile-friendly HTML with embedded CSS
4. Detect local Chromium-family browser
5. Capture full-page screenshot (segmented stitch with overlap)
6. Fall back to Playwright Chromium if no local browser is usable
7. Print JSON result with output_html and output_image paths

Scripts

Script	Purpose
scripts/markdown_to_long_image.py	CLI entry point, orchestrates pipeline
scripts/render_markdown_mobile_long_image.py	Markdown → styled mobile HTML
scripts/export_long_image.py	Browser detection + screenshot export

References

Topic	File
Pipeline details	references/workflow.md
Common issues	references/troubleshooting.md

Validation

After generating output, verify:

1. HTML file exists at reported path
2. Image file exists and is non-zero bytes
3. Image is full-page capture (not single viewport crop)
4. Remote images loaded without broken placeholders