Below is a collection of useful plugin “recipes” that you might find helpful.


Let’s say you’d like to track the language that was auto-detected via a data attribute. This might prove useful if you desired to add a dynamic label via CSS with :before, etc.

hljs.addPlugin( {
  'after:highlightElement': ({el, result}) => {
    // move the language from the result into the dataset
    el.dataset.language = result.language }