179

How can I create an image link using the Markdown format? I want an output like <a href="" rel="some text"><img src="/path/to/file" alt="" /></a>. I can't seem to find the answer in https://stackoverflow.com/editing-help.

4
  • 15
    ![](/path/to/file)
    – KennyTM
    Commented Feb 9, 2010 at 15:58
  • meta.stackexchange.com/questions/2133/…
    – random
    Commented Feb 10, 2010 at 13:40
  • May be this should be added to the FAQ and/or the editing help?
    – perbert
    Commented Feb 10, 2010 at 17:20
  • 1
    @Henke those links should be removed altogether – moderators and gold tag badge holders can do so, by reopening and closing the question again.
    – Glorfindel Mod
    Commented Jan 31, 2021 at 16:58

1 Answer 1

264

There does not appear to be a single markdown construct that will do what you want, however both of the following pieces of markdown work (as least on SO):

[<img src="http://www.google.com.au/images/nav_logo7.png">](http://google.com.au/)

[![Foo](http://www.google.com.au/images/nav_logo7.png)](http://google.com.au/)

I agree it would be a handy thing to have (along with markdown markup for width, height, floating left or right and adding a caption).

EDIT: I don't think there is any markdown available for the rel attribute of links.

<a href="http://google.com.au/" rel="some text">![Foo](http://www.google.com.au/images/nav_logo7.png)</a>

The above looks like your best case, although by this stage you almost might as well just use HTML for the image as well and be done with it.

8
  • At least in MarkDown Extra the following, more readable approach, will also work: ### [SmartyPants][] and other goodies [![SmartyPantsImg][]][SmartyPants] [SmartyPants]: daringfireball.net/projects/smartypants` [SmartyPantsImg]: daringfireball.net/graphics/smartypants_title.gif`
    – user246145
    Commented Dec 28, 2013 at 8:02
  • 1
    This is working for me. Markdown for image and link: ![Day calendar][ss1] Link reference: [ss1]: imgur.com/uqmd4li See it in action: github.com/Rundiz/thai-calendar
    – vee
    Commented May 3, 2016 at 5:24
  • 3
    The second example works on GitHub. Commented Jul 29, 2016 at 17:11
  • The first example works on thingiverse.
    – Gunslinger
    Commented Oct 13, 2017 at 7:19
  • This works in wordpress.com markdown enabled posts as well. Here's an example, atiqcs.wordpress.com/2018/07/05/… Commented Jul 5, 2018 at 22:48
  • There is an extra ] before </a> in the third example
    – grrigore
    Commented Jul 20, 2019 at 11:23
  • 1
    @grrigore Fixed. Thanks.
    – Evan
    Commented Jul 21, 2019 at 20:49
  • the 2nd one works fine on GitHub markup too, any idea how to open the link in a new tab? (aka target="_blank") when using that syntax (the non-html one) Commented Jan 12, 2021 at 10:48