Skip to content

Vue Showdown Default Classes

I want to achieve the following say i the MD as


I want to render it as


I was able to achieve this using VueShowdown

but I want add default class to every h1 tag like

<h1 class="custom">H1</h1>

I got something similar to this here.

But I don’t know how to use this in Vue.

Is it even possible in VueShowdown?

Is there any better library which has this functionality?


You can create a simple directive:

Vue.directive('default-classes', (parentElement) {
  const els = parentElement.querySelectorAll('h1')

  els.forEach((el) => {

Then apply that directive to the VueShowdown component:

<VueShowdown v-default-classes :markdown="markdownBinding" />