code

How to add a class name or id to an image tag inside a markdown file?

Yashu Mittal

When you want to add class name or id to an image tag inside a markdown file, you always have to use HTML to make it work.

For example:

<img src="https://www.codecarrot.net/images/favicon.png" alt="Image" class="className" />

But that’s not the case now.

When I started using Jekyll a year ago, there was this question always bugging me “How to add class name or id to an image tag inside a markdown file?”

A year later, when I was working on a new open source theme called Jasper 👻, the same question strikes again.

And after an hour’s of searching the web, reading the documentation and talking to the people in different communities.

This time I nailed it down.

Here’s the solution:

Add a Class Name

![Image](https://www.codecarrot.net/images/favicon.png){:.className}

Add an Id

![Image](https://www.codecarrot.net/images/favicon.png){:#id}

Response to “How to add a class name or id to an image tag inside a markdown file?”

Stay current

Sign up for our newsletter, and we'll send you news and tutorials on business, growth, web design, coding and more!