Claudia

Concisely designed & easy to config, match device dark mode, 90+ Lighthouse scoring

Demo

English | 简体中文

Changelog

Recent update 11.06.2022

How to Use

Install depend

Install to Hexo blog root directory, Not theme directory

npm install hexo-renderer-pug 
npm install hexo-renderer-dartsass
npm install hexo-generator-search

# if you need RSS, you must be install this plugin
npm install hexo-generator-feed

# Flowchat
npm install hexo-filter-flowchart        
# Math
npm install hexo-renderer-mathjax

User's profile

Configure the file hexo-theme-claudia/_config.yml under the theme profile

user:
  name: 
  avatar: /images/avatar.jpg
  location:
  description:
  footnotes:

# config you SNS
social:
  zhihu:
  twitter:
  facebook:
  linkedin:
  instagram:
  github: haojen

# Page icon
favicon: images/favicon.ico

friend_links:
  - title: Link1
    link: https://www.link1.test.com/

Upper-right navigation bar menu config

 # main menu navigation
 menu:
   Home: /
   About: /about
   Archives: /archives

Sidebar widget config

widgets:
  - tag
  - archive
  - category
  - recent_posts

Comments

1. Utteranc

Documents: https://utteranc.es/

Project repo: https://github.com/utterance/utterances

comment_utteranc:
  enable: true
  repo: Haojen/myBlogRepo # Change to your blog repo

2. Valine

Documents： https://valine.js.org/quickstart.html

comment_valine:
  enable: true
  appId:
  appKey:

Appearance

# 1.light 
# 2.dark
# 3.auto (default, match device appearance setting)
appearance: auto

Code highlighting

1. Disable the default hexo highlight configuration(modify your _config.yml in root directory of hexo), and then run hexo clean to delete cache

highlight:
  enable: false

Analytics

Google Analytics and Baidu Analytics simple config:

#Baidu Analytics**
ba_track_id: 

#Google Analytics
ga_track_id: 
ga_domain:

Create About Page

Create a new folder about under the source of hexo, and then, create a index.md file and copy the following content into it. also you about.png put in about/ folder

---
title: about
date: 2017-05-31 10:05:56
layout: about
---

My demo blog config

https://github.com/Haojen/Claudia-theme-blog

Other My Project

• Hexo-theme-Anisina
• Vimkey - a browser extension, let you use keyboard control browser
• PlanetTab - a cool dynamic 3D planet browser new tab

Buy me coffee ☕️

License

MIT © HAOZHEN MA