# Code Block Char Count

![Obsidian](https://img.shields.io/badge/Obsidian-1.4.0+-7c3aed?logo=obsidian&logoColor=white)

Display a **character count badge** at the bottom-right corner of every code block in Obsidian.

在 Obsidian 中每个代码块的右下角显示**字符数量统计**。

## Features / 功能

- **Live update / 实时更新** — the badge updates as you type / 输入时数字实时刷新
- **Works everywhere / 全场景支持** — reading view, live preview, and embedded renders (embeds, canvas) / 阅读视图、实时预览、嵌入渲染均支持
- **Visible characters only / 只统计可见字符** — spaces, tabs and newlines are excluded / 空格、制表符与换行不计入
- **Zero config / 零配置** — no settings, just enable and go / 无需任何设置，启用即用

## Install / 安装

### BRAT (recommended / 推荐)

1. Install and enable [BRAT](https://github.com/TfTHacker/obsidian42-brat)
2. Run `BRAT: Add a beta plugin for testing`
3. Enter `power-ioi/code-block-char-count`

### Manual / 手动安装

1. Download `main.js`, `manifest.json`, `styles.css` from the [latest release](https://github.com/power-ioi/code-block-char-count/releases/latest)
2. Put them into `<vault>/.obsidian/plugins/code-block-char-count/`
3. Restart Obsidian, then enable **Code Block Char Count** in `Settings → Community plugins`

## Usage / 使用

No configuration needed. Open any note with a code block and you will see a small badge like `32 字符` at its bottom-right corner.

无需配置。打开任意包含代码块的笔记，右下角即可看到如 `32 字符` 的小角标。

## How it works / 实现原理

- **Live preview**: a CodeMirror 6 `ViewPlugin` scans the editor syntax tree (`HyperMD-codeblock` line groups) and attaches a line decoration to the last line of each code block.
- **Reading view**: a `registerMarkdownPostProcessor` hook appends the badge to each rendered `<pre>` element.

## License / 许可

MIT