figure element

[iNerdier]

I’ve been trying to write lately with kramdown's markdown parser and I’ve come across two problems that seem to unsolvable in the current release.

One is that there seems to be no way to stop kramdown from wrapping image links in

tags. This is often fine but when paired with something like

p + p {
    text-indent: 1em;
}

the results are less than happy, images inherit unwanted text stylings and go all over the shop.

Markdown is smart enough not to add tags to existing block level elements, could the same method be used to allow specifying of stand-alone images?

If this is unfeasible or undesirable, could it be possible to allow it via an option ( say :image_block => true )

The second problem is attempting to use html5's new

and elements. According to can I use it all major browsers now support them and they’re certainly a great help in writing articles with images that need citations or have direct references to text.

Looking through google to see if anyone has attempted it I found https://github.com/michelf/php-markdown/wiki/HTML5-update which seems to have a pretty useful starting point for working out a syntax to use them.

Would either of these problems be something we might be able to do something about?

[gettalong]

You can already avoid paragraph tags for images like this:

this is 

{::nomarkdown}
<img test="test" />
{:/}

this is

results in

<p>this is </p>

<img test="test" />

<p>this is</p>

And you can already use <figure> and <figcaption>:

<figure markdown="1">
<figcaption>
test
</figcaption>
![test](img.jpg)
</figure>

gives you

<figure>
  <figcaption>
test
</figcaption>
  <p><img src="img.jpg" alt="test" /></p>
</figure>

I have currently no intention to provide extra syntax HTML5 specific tags like <figure>, <article>, ...

[AvverbioPronome]

I'm probably late to this, but I like a lot how Pandoc handles this: if an image is in a paragraph on its own, it becomes a figure, and its alt-text is used as caption.

[RoyiAvital]

Any chance having syntax for Figure?

Something like using the alt-text as caption as suggested by @9peppe ?

Thank You.

[gettalong]

I can imagine providing a new option for changing the behaviour of how paragraphs with only an image are converted, similar to how the LaTeX converter currently does it - see https://github.com/gettalong/kramdown/blob/master/lib/kramdown/converter/latex.rb#L71

@9peppe / @RoyiAvital What should the output for the following kramdown fragment should be if the option to convert standalone images is activated?

This is a para with an ![image](some.jpg).

![standalone image](some.jpg)

Note that the alternative text of the image cannot contain markup, it is just text.

[AvverbioPronome]

I'd say

<p>This is a para with an <img alt="image" src="some.jpg" /></p>

<figure id="someid">
  <img alt="standalone image" src="some.jpg" />
  <figcaption>standalone image</figcaption>
</figure>

[RoyiAvital]

3 Remarks (Though I'm not sure they are doable):

1. Could we have a flag of some kind to whether use Figure or regular Image element?
   Maybe something like ![standalone image figure="true"](some.jpg).
2. Currently kramdown allows adding HTML using ![standalone image](some.jpg){:class="center-img"}. It should be kept.
3. In Pandoc they created reference system using \tag. Is there an option doing so here as well?

[gettalong]

@9peppe If the image had an ID assigned, should it then be on the figure tag or on the img tag?

@RoyiAvital

ad 1) No. If the new option to process a paragraph with a single item being an image is activated, the output is changed. The only way this would be doable would be via the option value itself.

ad 2) The parser is not touched, only the output is changed.

ad 3) I don't know what you mean. If you set an id on the image, you can use that id later.

[AvverbioPronome]

I don't know. I think it will depend on individual use cases. But if we apply it to figure, then we can use css selectors like #id img.

[gettalong]

That's what I was thinking, i.e. class and id attributes are transferred to the figure tag, all others stay with the image.

[RoyiAvital]

@gettalong ,
First thank you for the answer and the openness.
Could you explain:

ad 1) No. If the new option to process a paragraph with a single item being an image is activated, the output is changed. The only way this would be doable would be via the option value itself.

Thank You.

[gettalong]

@RoyiAvital I'm against changing the kramdown parser. Therefore the way to specify how a paragraph with only an image should be rendered is via the new option that changes how the converter works. E.g. if the option's value is "figure", then a figure tag is rendered, if it is "image" than just the image without enclosing paragraph tags is rendered.