HTML Attributes

[gavinhow]

Hi,
I was hoping someone could help in helping me understand how to use html attributes?
I think I can understand how to access them in PHP code but how do you define them in markdown
What is the syntax for putting attributes in Markdown? Or am I misunderstanding what this is.

Thanks

[colinodell]

So the CommonMark spec that we're implementing does not allow users to put any arbitrary HTML attributes they want into their Markdown.

Some CommonMark/Markdown features do create certain HTML attributes automatically. For example, if you define a language for your fenced code block like this...

```php
// Some PHP code goes here
```

... then we'll take that php and create a class based on it:

<pre><code class="language-php"> ...

If you really wanted full control over the HTML attributes, I'd recommend simply including that HTML inside your Markdown like this:

# My Awesome Blog Post

<img src="/everything-is-awesome.png" class="img-responsive" alt="Description of my image">

**Here's a list!**
1. Foo
2. Bar
3. Baz

(I do this quite often on my personal site - my blog posts are mostly Markdown, but if I need certain HTML attributes I'll just add a line or two of raw HTML in there)

If you are writing your own custom parsers/renderers/extensions you can certainly take advantage of that PHP code so that additional attributes are added.

I hope that makes sense :)

[gavinhow]

Thanks for your swift reply @colinodell .
I was planning to create some of my own renderers,
This was something I had come across Issue 165 and Issue 145 and I understood that to mean I could have custom HTML attributes if I created the corresponding renderers myself. I specifically would like to add classes to images. For example to create different size images.

HTML was something I was hoping to be able to avoid putting in my Markdown and I could simply create my own renderer to add this later.

[colinodell]

Gotcha!

You could extend/replace CloseBracketParser with something that parses and adds the necessary classes, but I must admit it's not the most developer-friendly thing to override. The methods inside of here may change in any future 0.x or 1.0 release, so you would need to be extra careful when upgrading to newer versions of this library.

Another potential approach could be implementing your own document processor that iterates through the AST, identifies Image elements, and adds the necessary attributes. The downside is that this won't have access to the original Markdown syntax, so that would make it slightly difficult to determine when to add different types of classes/attributes.

I hope this at least gets you moving in the right direction!

[colinodell]

Actually, I just stumbled upon this extension which might suit your needs! https://github.com/webuni/commonmark-attributes-extension