Markdown image titles

Question

I have a simple markdown file containing an image:

![image](MyLovelyImage.png "some title")

I'm using the GitHub viewer and there I see the image fine, but without the title / caption. Is there any way to solve this?

Answer 1

Markdown's link / image titles aren't the same as captions, and Markdown itself has no support for captions.

However, since Markdown supports inline HTML, you can caption images using <figure> and <figcaption>.

Here is an example from the previous MDN link:

<figure>
  <img
  src="https://developer.mozilla.org/static/img/favicon144.png"
  alt="The beautiful MDN logo.">
  <figcaption>MDN Logo</figcaption>
</figure>

Answer 2

I don't like HTML in Markdown. This is why here an idea to solve it with plain markdown. The markdown (set two css-classes to the p-wrapper) and the logo_caption inside the p-wrapper. Title and Alt were already there.

{: .cssclass1 .cssclass2 }
![Logo](/assets/img/logo.jpg "Logo title")
*logo_caption*

Output as HTML

<p class="cssclass1 cssclass2">
  <img src="/assets/img/logo.jpg" alt="Logo" title="Logo title">
  <em>logo_caption</em>
</p>

The styling can be done in CSS.

Tested in jekyll v4.2 and kramdown.