A plugin for mkdocs that inlines select SVG markdown images (`![](foo.svg)`) so that links in the SVG work without breaking SVG icons
APACHE-2.0 License
A MkDocs plugin that inlines SVG images matching a pattern into the output without inlining Materials theme icons.
This differs from previously developed plugins in several ways:
.do-not-inline
.This plugin operates post HTML generation looking for img
elements like
<img src="foo.svg" ...>
When the src is a path-local URL with a path component that ends
with .svg
and it matches the configured pattern then the file is
read from the local file system and inlined in place.
Alt text is ignored in favour of any SVG <title>
element.
If the SVG contains any elements marked with class="do-not-inline"
,
they will not be included in the inlined content.
This is useful when your SVG images contain <style>
elements that
you do not want to bleed into the containing scope, and your Mkdocs
configuration includes extra CSS stylesheets that suffice.
To download and install this module, run:
pip install mkdocs-inline-select-svg-plugin
Enable the plugin in your mkdocs.yml by adding inline-select-svg
as a list item under the plugins section. Since that section will almost certainly include search you might end up with something like this:
plugins:
- search
- inline-select-svg
If you want to filter which SVGs to inline, by path, you can specify a regular expression using the pattern config option thus:
plugins:
- search
- inline-select-svg:
pattern: "[.]inline[.]svg$"
With that configuration, <img src="../foo.inline.svg">
would be
inlined but <img src="../foo.svg">
would not.