Markdown-it-info NPM

markdown-it-info

GitHub License npm npm

The markdown-it plugin that enables easy creation of Qiita and Zenn-style admonition boxes within Markdown documents.

Install via npm:

npm install markdown-it-info

Use with markdown-it:

const 
    md = require('markdown-it')(),
    plugin = require("markdown-it-info");

md.use(plugin,{options});

Params:

options:
- admonitionStyle - Optional value to change the CSS style sheet. Default is “default”, others are “qiita” and “zen”.
- defaultType - Optional value to change the default type of the box. Default is “info”, others are “warn”, “warning”, “alert” and “question”.
- defaultTitle - Optional value to change the default title of the box. Default is “Enter the title here”.

Input in Markdown:

:::note info TITLE
CONTENT
:::

Rendering in HTML:

<div class="default-admonition info">
<p class="default-admonition-title">TITLE</p>
<p>CONTENT</p>
</div>

This is a markdown-it plugin that allows you to easily create an “Admonition Box”.

Normally, the “default-admonition” class is assigned, but “qiita-admonition” and “zenn-admonition” can be assigned by changing the admonitionStyle.

This plugin alone only gives a class, but the included stylesheet will decorate the box.

admonitionStyle is "default":

default-admonition

admonitionStyle is "qiita":

qiita-admonition

admonitionStyle is "zenn":

zenn-admonition

markdown-it-info's key features include:

Add admonition boxes with Syntax like Qiita and Zenn
Support multiple box types (e.g. info, warn, alert, question)
Enable Markdown syntax within boxes (lists, emphasis, strikethrough, code spans, links, images, code blocks)
Supports nesting of boxes within each other

These features enhance the readability and visual appeal of technical documents and blog posts.

In developing this project, we referenced the following open source software. We would like to express our gratitude:

6 months ago

6 months ago

6 months ago