Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 153 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

I want to provide a link to my LinkedIn profile on the About Me page of my StackOverflow profile in the form of a link badge. LinkedIn offers several link badges and their HTML code.

I chose one badge and its HTML code is:

<a href="http://pk.linkedin.com/pub/ghazanfar-abbas/27/a/18b">

<img src="http://www.linkedin.com/img/webpromo/btn_viewmy_160x33.png" width="160" height="33" border="0" alt="View Ghazanfar Abbas's profile on LinkedIn">

</a>

In the LinkedIn instructions, it is written that just copy and paste the code where I want to show the badge. How can I use the above code to display the badge with my LinkedIn profile link on the About Me page of my profile? I have no idea how to write or use HTML.

share|improve this question
up vote 8 down vote accepted

You can translate that to Markdown quite easily:

[![View Ghazanfar Abbas's profile on LinkedIn](http://www.linkedin.com/img/webpromo/btn_viewmy_160x33.png)](http://pk.linkedin.com/pub/ghazanfar-abbas/27/a/18b)

which becomes:

View Ghazanfar Abbas's profile on LinkedIn

That's a ![alt text](url) image link nested inside of a [link item](url) markdown link. You could use [...][#] numbered links too:

[![View Ghazanfar Abbas's profile on LinkedIn][1]][2]

[1]: http://www.linkedin.com/img/webpromo/btn_viewmy_160x33.png
[2]: http://pk.linkedin.com/pub/ghazanfar-abbas/27/a/18b

Alternatively, you can re-use the HTML LinkedIn provides, but you'll have to stick to the HTML subset supported.

The following HTML works:

<a href="http://pk.linkedin.com/pub/ghazanfar-abbas/27/a/18b">

<img src="http://www.linkedin.com/img/webpromo/btn_viewmy_160x33.png" width="160" height="33" alt="View Ghazanfar Abbas's profile on LinkedIn">

</a>

removing the border="0" attribute, which renders as:

View Ghazanfar Abbas's profile on LinkedIn

share|improve this answer
    
Awesome!!!. Thank you sooo much :) – sgarizvi Feb 16 '13 at 17:36
    
Great. I didn't know we could use nested alternate text feature. – sgarizvi Feb 16 '13 at 17:41
    
Nice, you've found a way to link images without the dotted border! Just add some additional newlines within the <a> -- I never noticed that. – Arjan Feb 17 '13 at 11:59

You must log in to answer this question.

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