# remark-attr This plugin add support of custom attributes to Markdown syntax. For **security reasons**, this plugin use [html-element-attributes](https://github.com/wooorm/html-element-attributes). The use of JavaScript attributes (onload for example) is not allowed by default. ## Default Syntax Images : ```markdown ![alt](img){attrs} / ![alt](img){ height=50 } ``` Links : ```markdown [Hot babe with computer](https://rms.sexy){rel="external"} ``` Header (Atx) : ```markdown ### This is a title {style="color:red;"} ``` Header : ```markdown This is a title --------------- {style="color: pink;"} ``` Emphasis : ```markdown Npm stand for *node*{style="color:red"} packet manager. ``` Strong : ```markdown This is a **Unicorn**{awesome} ! ``` Delete : ```markdown Your problem is ~~at line 18~~{style="color: grey"}. My mistake, it's at line 14. ``` Code : ```markdown You can use the `fprintf`{language=c} function to format the output to a file. ``` ## rehype At the moment it aims is to be used with [rehype][rehype] only, using remark-rehype. ```md [Hot babe with computer](https://rms.sexy){rel="external"} ``` gives: ```html Hot babe with computer ``` ## Installation [npm][npm]: ```bash npm install remark-attr ``` ## Dependencies: ```javascript const unified = require('unified') const remarkParse = require('remark-parse') const stringify = require('rehype-stringify') const remark2rehype = require('remark-rehype') const remarkAttr = require('remark-attr') ``` ## Usage: ```javascript const testFile = ` Here a test : ![ache avatar](https://ache.one/res/ache.svg){ height=100 } ` unified() .use(remarkParse) .use(remarkAttr) .use(remark2rehype) .use(stringify) .process( testFile, (err, file) => { console.log(String(file)) } ) ``` Output : ```shell $ node index.js
Here a test :