Complete Guide to Writing Articles Locally with Hexo + Typora

πŸš€ Typora Download & Configuration

Download and Installation

First, download Typora from the official website: https://typoraio.cn/

Typora Official Download Page

Typora is an excellent Markdown editor with the following features:

  • 🎨 WYSIWYG editing experience
  • πŸ“ Real-time preview support
  • πŸ–ΌοΈ Powerful image processing functionality
  • 🎯 Clean and elegant interface design

Theme Configuration

Choose your favorite theme from the Theme Gallery in the top-right corner of the official website. I recommend using the Mdmdt theme, with the following effect:

Mdmdt Theme Effect

Installation Steps:

  1. Download theme files from GitHub
  2. Open Typora preferences
  3. Click β€œOpen Theme Folder”
  4. Copy the downloaded theme files to the folder
  5. Restart Typora and select the theme

Theme Folder Location

⚠️ Note: Installation methods may vary slightly for different themes. Please carefully read the installation instructions provided by the author.

πŸ“ Hexo Configuration & Publishing

Detailed Hexo Markdown Parameters

In Hexo, the front-matter (YAML configuration at the top of files) for each article supports various parameters. Here’s a complete parameter explanation:

Configuration Option Default Value Description
title Markdown file title Article title, strongly recommended to fill this option
date File creation time Publication time, recommended to fill and ensure global uniqueness
author author in root _config.yml Article author, can override global settings
img A value from featureImages Article feature image, recommend using image hosting service
top false Recommended article, set to true to pin article
cover false Carousel cover, whether to add to homepage carousel
coverImg None Carousel image, image path displayed in homepage carousel
password None Reading password, requires SHA256 encryption
toc true Table of contents switch, whether to show article TOC
mathjax false Math formulas, whether to support LaTeX formulas
summary None Article summary, custom summary content
categories None Article categories, recommend one category per article
tags None Article tags, one article can have multiple tags
keywords Article title Keywords, used for SEO optimization
reprintPolicy cc_by Reprint rules, copyright declaration type

Complete Configuration Example

Here’s a complete example including all parameters:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
---
title: Complete Guide to Writing Articles with Hexo + Typora
author: Leion Charrrrls
date: 2025-07-23 10:45:37
img: /source/images/hexo-typora-guide.jpg
top: true
cover: true
coverImg: /images/covers/hexo-typora-banner.jpg
password: 8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923adc6c92
toc: true
mathjax: false
summary: This is a detailed guide on how to use Hexo + Typora for blog writing, including environment configuration, theme setup, image processing, and the complete workflow.
categories: 
  - Tech Sharing
tags:
  - Hexo
  - Typora
  - Markdown
  - Blog Setup
keywords: Hexo, Typora, Markdown, Blog, Writing Tools
reprintPolicy: cc_by_nc_sa
---

Create New Article

Use Hexo commands to create new articles:

1
2
3
4
# Create new article
hexo new "Article Title"
# Short form
hexo n "Article Title"

Custom Article Template

The default article template is quite simple. We can customize the template by modifying blog/scaffolds/post.md:

Original template:

1
2
3
4
5
---
title: {{ title }}
date: {{ date }}
tags:
---

Recommended enhanced template:

1
2
3
4
5
6
7
8
9
10
11
---
title: {{ title }}
date: {{ date }}
author: Leion Charrrrls
cover: ""
tags: []
categories: []
password: ""
summary: ""
toc: true
---

⚠️ Important Reminder:

  • YAML syntax requires a space after the colon: key: value
  • Empty values must use quotes: cover: ""
  • Arrays can use [] or multi-line format
  • Cannot leave empty values, otherwise parsing errors occur

Image Processing Best Practices

I use Typora combined with uPic for automatic image upload:

uPic Configuration Interface

Configuration Steps:

  1. Install uPic image hosting tool
  2. Configure GitHub as image hosting service
  3. Set up automatic upload in Typora

GitHub Image Hosting Configuration

Advantages:

  • βœ… Automatic upload, no manual processing needed
  • βœ… CDN acceleration, fast access speed
  • βœ… Version control, image backup available
  • βœ… Cross-platform sync, write anywhere anytime

🎯 Writing Workflow Summary

  1. Environment Setup

    • Install and configure Typora
    • Set favorite theme
    • Configure automatic image upload

  2. Create Article

    1
    hexo new "Article Title"

  3. Write Content

    • Open md file with Typora
    • Complete front-matter configuration
    • Write article content
    • Insert images (auto-upload)

  4. Preview and Publish

    1
    2
    3
    4
    hexo clean    # Clean cache
    hexo generate # Generate static files
    hexo server   # Local preview
    hexo deploy   # Deploy and publish

πŸ’‘ Summary

The Hexo + Typora combination has the following advantages:

  • πŸš€ Efficient Writing: WYSIWYG editing experience
  • 🎨 Beautiful Interface: Clean and elegant design style
  • πŸ–ΌοΈ Image Convenience: Auto-upload, no manual processing needed
  • ⚑ Quick Publishing: One-click static blog generation
  • πŸ”§ Highly Customizable: Rich theme and plugin ecosystem

This toolchain is perfect for technical blog writing and highly recommended for all bloggers! ✨