How to add css classes to markdown anchor?

support
1

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!

2

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 title 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.

3

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!

4

You can use Positional or Named Shortcode Parameters to render a class.

1 Like