# How to add css classes to markdown anchor?

**URL:** <https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422>\
**Category:** support\
**Created:** [February 12, 2020, 6:03pm UTC](https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422 "2020-02-12T18:03:22Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![dommcloughlin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/dommcloughlin/32/10751_2.png) [@dommcloughlin](https://discourse.gohugo.io/u/dommcloughlin)\
**Post date:** [February 12, 2020, 6:03pm UTC](https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422/1 "2020-02-12T18:03:22Z")

</div>

Hi folks.

Can anybody shed some light on the simplest way to add a css class to an anchor in markdown.  
Eg: I’d like to call a class on this.  
`[Contact me](/contact)`

Can it be done in a simple way with a hashtag somewhow, not a complex custom shortcode template?

Thanks for your help!

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [February 12, 2020, 6:36pm UTC](https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422/2 "2020-02-12T18:36:27Z")

</div>

If you are not setting the `title` attribute for your markdown anchors you can use it to set a class like so:

markdown input: `[link](/uri "title")`  
render-link.html: `{{ with .Title }}class="{{ . }}"{{ end }}`

If you are using the `titl`e attribute then unfortunately it is not straightforward to set the class. It can be done with conditional logic and some kind of search and replace but in my opinion you would be better off using a shortcode.

---

<div class="post-metadata">

**Author:** ![dommcloughlin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/dommcloughlin/32/10751_2.png) [@dommcloughlin](https://discourse.gohugo.io/u/dommcloughlin)\
**Post date:** [February 12, 2020, 7:57pm UTC](https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422/3 "2020-02-12T19:57:43Z")

</div>

Thanks for that, really useful info and pretty cool.

I try to be as accessible where possible so I’d prefer to include the title. Would the short code solution also be relatively simple. I’ve surprisingly not found any exact info on what is surely a common requirement.

Thanks for your help!

---

<div class="post-metadata">

**Author:** ![alexandros](https://avatars.discourse-cdn.com/v4/letter/a/ecc23a/32.png) [@alexandros](https://discourse.gohugo.io/u/alexandros)\
**Post date:** [February 12, 2020, 8:58pm UTC](https://discourse.gohugo.io/t/how-to-add-css-classes-to-markdown-anchor/23422/4 "2020-02-12T20:58:03Z")

</div>

> [@dommcloughlin](#):
>
> Would the short code solution also be relatively simple

You can use [Positional or Named Shortcode Parameters](https://gohugo.io/templates/shortcode-templates/#positional-vs-named-parameters) to render a class.
