Skip to content

Updated images documentation to include pymdownx.blocks.caption exten… #7654

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Oct 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions docs/reference/images.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,18 @@ following lines to `mkdocs.yml`:
markdown_extensions:
- attr_list
- md_in_html
- pymdownx.blocks.caption
```

See additional configuration options:

- [Attribute Lists]
- [Markdown in HTML]
- [Caption]

[Attribute Lists]: ../setup/extensions/python-markdown.md#attribute-lists
[Markdown in HTML]: ../setup/extensions/python-markdown.md#markdown-in-html
[Caption]: ../setup/extensions/python-markdown-extensions.md#caption

### Lightbox

Expand Down Expand Up @@ -135,6 +138,16 @@ but it's always possible to use the [Markdown in HTML] extension with literal
</figure>
</div>

However, [Caption] provides an alternative syntax to add captions
to any Markdown block element, including images:

``` markdown title="Image with caption"
![Image title](https://dummyimage.com/600x400/){ width="300" }
/// caption
Image caption
///
```

### Image lazy-loading

Modern browsers provide [native support for lazy-loading images][lazy-loading]
Expand Down
19 changes: 19 additions & 0 deletions docs/setup/extensions/python-markdown-extensions.md
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,25 @@ documentation][BetterEm] for more information.

[BetterEm]: https://facelessuser.github.io/pymdown-extensions/extensions/betterem/

### Caption

<!-- md:version 1.0.0 -->
<!-- md:extension [pymdownx.blocks.caption][Caption] -->

The [Caption] extension adds the ability to add captions to any Markdown block,
including images, tables, and code blocks. Enable it via `mkdocs.yml`:

``` yaml
markdown_extensions:
- pymdownx.blocks.caption
```

The configuration options of this extension are not specific to Material for
MkDocs, as they only impact the Markdown parsing stage. See the [Caption
documentation][Caption] for more information.

[Caption]: https://facelessuser.github.io/pymdown-extensions/extensions/blocks/plugins/caption/

### Caret, Mark & Tilde

<!-- md:version 1.0.0 -->
Expand Down