Remark plugin to add attributes to markdown and mdx images
Adds attributes to images by extending the default syntax like![](path)(attribute1: value, attribute2: value)
. Attributes will be applied to the hProperties of that image node.
Note
Should support almost any syntax although sizes
and any attribute with commas in it needs to be inside quotes.
If using remark-unwrap-images run this plugin first
import { defineConfig } from 'astro/config';
import imgAttr from 'remark-imgattr';
// https://astro.build/config
export default defineConfig({
markdown: {
remarkPlugins:[imgAttr]
}
});
![Style](path)(style: border: 1px solid #ccc; padding: 10px;, width:100)
![alt text](path)(width: 300, height: 150)
![](path)( width:300, widths:[300,600], sizes:"(min-width: 600px) 600w, 300w" )
![](path)(quality:100)