What is meta? ×
Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 130 Stack Exchange communities.

What's the recommended syntax for an image with a hyperlink? I tried doing it with the markdown toolbar buttons and the image and link buttons conflict with each other, so I had to resort to HTML.

For example, to do this:

alt text

These work properly:

<a href="http://meta.stackoverflow.com/users/44330/jason-s">![alt text][1]</a>
[1]: http://www.gravatar.com/avatar/dd5a7ef1476fb01998a215b1642dfd07?s=128&d=identicon&r=PG

<a href="http://meta.stackoverflow.com/users/44330/jason-s">
   <img src="http://www.gravatar.com/avatar/dd5a7ef1476fb01998a215b1642dfd07?s=128&d=identicon&r=PG">
</a>

[<img src="http://www.gravatar.com/avatar/dd5a7ef1476fb01998a215b1642dfd07?s=128&d=identicon&r=PG">][2]
[2]: http://meta.stackoverflow.com/users/44330/jason-s

This does not:

<a href='http://meta.stackoverflow.com/users/44330/jason-s'>![alt text][1]</a>

(single quotes not allowed?)

Is there a way to do the same thing in Markdown without having to resort to HTML?

Return to FAQ index

share|improve this question

4 Answers 4

up vote 57 down vote accepted

It is possible to use Markdown for both the image and the link. You'll have to do it manually because, as you said, the toolbar isn't smart enough to do it for you:

[![alt text][2]][1]

  [1]: http://meta.stackoverflow.com/users/44330/jason-s
  [2]: http://www.gravatar.com/avatar/dd57e..dfd07?s=128&d=identicon&r=PG (hover text)

alt text

share|improve this answer
4  
In other words, whatever the syntax for the image, treat that whole syntax as the text to link. So the ugly syntax also works: [![alt text](image link)](web link) –  ShreevatsaR Jan 9 '11 at 5:55
    
Excellent! It makes sense but I never got that far in because once I start typing it I think to myself, this can't possibly be right, it's too ugly. but it aint... you ugly! ;) –  Flowpoke Mar 21 '11 at 17:00
    
This works in general for Markdown, not only for StackOverflow, it seems! –  fatuhoku Aug 19 '13 at 23:52

Not sure if this is what you are asking but you can nest the image inside the link markup like so.

[ ![Image](/images/image.jpg "Image title") ](http://google.com "Google")

share|improve this answer
6  
Yes, this is Kyle Cronin's answer. (Posted a year before yours!) –  ShreevatsaR Feb 1 '11 at 5:28
    
This answer uses the inline style, which I prefer. –  JDB Sep 3 '13 at 17:47

this is also a way to do it

[ ![your alt][1]](http://meta.stackoverflow.com/users/214576/nickleefly)

[1]: http://www.gravatar.com/avatar/904b50a077af81db10ea520be1127968?s=128&d=identicon&r=PG
share|improve this answer
    
So what does that markup end up showing? An example would be great. –  Lance Roberts Mar 7 '13 at 14:48
    
@LanceRoberts I updated the markup, it was a wrong format, sorry for any inconvenience. –  nickleefly Mar 17 '13 at 15:19

The specifics of what HTML is and isn't allowed are outlined in this question.

share|improve this answer
    
Sure but my question (I'll revise the title) is whether or not there's a markdown syntax for it. –  Jason S Jul 3 '09 at 14:27
    
I don't think so, but how often are images linked? –  Ian Elliott Jul 3 '09 at 15:15
3  
More often than not. It's quite useful to link to the page were you are borrowing the image from. –  perbert Jul 3 '09 at 17:36

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .