Skip to main content

markdown-it-py plugin to convert image paragraphs to HTML figure elements

Project description

mdit-py-figure

PyPI version Python versions License

mdit-py-figure is a markdown-it-py plugin to parse markdown paragraphs that start with an image into HTML <figure> elements. One nice thing is it doesn't use any new markdown syntaxes.

Example markdown source:

![Picture of Oscar.](/path/to/cat.jpg)
Awesome caption about **Oscar** the kitty.

Render result:

<figure>
<img src="/path/to/cat.jpg" alt="Picture of Oscar." />
<figcaption>Awesome caption about <strong>Oscar</strong> the kitty.</figcaption>
</figure>

Multiple images are supported:

![Picture of Oscar.](/path/to/cat1.jpg)
![Picture of Luna.](/path/to/cat2.jpg)
Awesome captions about the **kitties**.
<figure>
<img src="/path/to/cat1.jpg" alt="Picture of Oscar.">
<img src="/path/to/cat2.jpg" alt="Picture of Luna.">
<figcaption>Awesome captions about the <strong>kitties</strong>.</figcaption>
</figure>

Why?

Using dedicated <figure> and <figcaption> elements makes styling images with descriptions much easier. Here is an example:

Example of an HTML figure with figcaption.

I hear they are also good for SEO.

Installation

pip install mdit-py-figure

Or with uv:

uv add mdit-py-figure

Usage

from markdown_it import MarkdownIt
from mdit_py_figure import figure_plugin

md = MarkdownIt().use(figure_plugin)

source = """
![Picture of Oscar.](/path/to/cat.jpg)
Awesome caption about **Oscar** the kitty.
"""

html = md.render(source)
print(html)

Option to add link to the image

Example:

md = MarkdownIt().use(figure_plugin, image_link=True)

Render result:

<figure>
<a href="/path/to/cat.jpg">
<img src="/path/to/cat.jpg" alt="Picture of Oscar." />
</a>
<figcaption>Awesome caption about <strong>Oscar</strong> the kitty.</figcaption>
</figure>

See tests/test_figure.py for more examples.

Option to skip images without captions

Example:

md = MarkdownIt().use(figure_plugin, skip_no_caption=True)

In case a link to an image doesn't have a caption (a line of text following it without any linebreaks in between), it won't be wrapped in a <figure>.

See test_skip_no_caption_option() in tests/test_figure.py for an example.

Changelog

[Unreleased]

Nothing noticeable unreleased.

v1.0.1 (2025-12-27)

  • Fix README rendering on the PyPI page.

v1.0.0 (2025-12-27)

LICENSE

Apache-2.0

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

mdit_py_figure-1.0.1.tar.gz (3.1 MB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

mdit_py_figure-1.0.1-py3-none-any.whl (9.2 kB view details)

Uploaded Python 3

File details

Details for the file mdit_py_figure-1.0.1.tar.gz.

File metadata

  • Download URL: mdit_py_figure-1.0.1.tar.gz
  • Upload date:
  • Size: 3.1 MB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.7

File hashes

Hashes for mdit_py_figure-1.0.1.tar.gz
Algorithm Hash digest
SHA256 3e42d01093c3b2003a8d456d20efd4721d6f43e4633b6741d435ef7619c0a60f
MD5 6ff324469f864cba406ea45854ad76e9
BLAKE2b-256 c3d94da3ba554ad455faa2f5c5b540e720abd3e1e45d7e501ed2c7ec8fe6234f

See more details on using hashes here.

Provenance

The following attestation bundles were made for mdit_py_figure-1.0.1.tar.gz:

Publisher: pypi_upload.yml on mangoumbrella/mdit-py-figure

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file mdit_py_figure-1.0.1-py3-none-any.whl.

File metadata

  • Download URL: mdit_py_figure-1.0.1-py3-none-any.whl
  • Upload date:
  • Size: 9.2 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.7

File hashes

Hashes for mdit_py_figure-1.0.1-py3-none-any.whl
Algorithm Hash digest
SHA256 a7a29838d5c6d278ea6c8311e941aef0dedea2c4febcc2289cf2097d73ce7428
MD5 4c1cf5d938e2b2b96e4052ac908eb0f8
BLAKE2b-256 9f80cc7d355ed5411c2d20ad3649c6fb79f965bef2797e302e70b1445822e568

See more details on using hashes here.

Provenance

The following attestation bundles were made for mdit_py_figure-1.0.1-py3-none-any.whl:

Publisher: pypi_upload.yml on mangoumbrella/mdit-py-figure

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page