# Markdown syntax

**URL:** <https://talk.jekyllrb.com/t/markdown-syntax/6061>\
**Category:** Help\
**Created:** [May 19, 2021, 8:59pm UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061 "2021-05-19T20:59:26Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![elmussol](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/elmussol/32/3497_2.png) [@elmussol](https://talk.jekyllrb.com/u/elmussol)\
**Post date:** [May 19, 2021, 8:59pm UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061/1 "2021-05-19T20:59:26Z")

</div>

I know how to do images in Markdown and I know how to do links in Markdown, but I’m not sure how to combine the two.

I want `![my image](assets/img/my_img.png)` to work as a button that goes to `[my link](http://mysite.com/index.html)`.

Do I have to get HTML involved here?

---

<div class="post-metadata">

**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\
**Post date:** [May 20, 2021, 7:43am UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061/2 "2021-05-20T07:43:24Z")

</div>

In HTML to add a link to an image you wrap the image in a

```auto
<a href="/about.html">
    <img src="photo.png" alt="Photo of me"/>
</a>

```

So the same in Markdown.

Just an image

```auto
![Photo of me](/photo.png)

```

Just a link.

```auto
[Link fallback text](/about.html)

```

Combine both by putting the image as the link text, which was invisible before.

```auto
[![Photo of me](/photo.png)](/about.html)

```

See also linked images here

> **[Markdown Quick Reference Cheat Sheet](https://wordpress.com/support/markdown-quick-reference/)**
>
> Note: The instructions from this guide are referring to the Classic Editor. If you are using the WordPress block editor, please see this guide. See the Markdown page for instructions on enabling Ma…

Or my image Cheatsheet

> **[Images](https://michaelcurrin.github.io/dev-cheatsheets/cheatsheets/markdown/images.html)**
>
> A collection of code snippets and CLI guides for quick and easy reference while coding

---

<div class="post-metadata">

**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\
**Post date:** [May 20, 2021, 7:48am UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061/3 "2021-05-20T07:48:50Z")

</div>

Also for common flows and syntax, remember to search the forums

This same question was asked just 30 days ago. Search for “Markdown image” and it’s the second result.

> [@How to add a image with links in markdown?](https://talk.jekyllrb.com/t/how-to-add-a-image-with-links-in-markdown/5915):
>
> [flipkart] When user click in this image it has to redirect to the the site. I know how to do it in HTML i just don’t know it in markdown

---

<div class="post-metadata">

**Author:** ![elmussol](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/elmussol/32/3497_2.png) [@elmussol](https://talk.jekyllrb.com/u/elmussol)\
**Post date:** [May 20, 2021, 8:03am UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061/4 "2021-05-20T08:03:37Z")

</div>

This is what I needed, thanks @MichaelCurrin. My search foo failed. Sorry.

---

<div class="post-metadata">

**Author:** ![MichaelCurrin](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/michaelcurrin/32/2340_2.png) [@MichaelCurrin](https://talk.jekyllrb.com/u/MichaelCurrin)\
**Post date:** [May 20, 2021, 8:12am UTC](https://talk.jekyllrb.com/t/markdown-syntax/6061/5 "2021-05-20T08:12:39Z")

</div>

Good 🙂

Practice your search fu, grasshopper, and you will become a mighty search ninja. 🙏🙇‍♂