What's a good way to add attributes (classes etc.) to the HTML elements returned from the markdown filter?


This is what I currently do to add a class Bibliography to all generated <ul> tags from my articleBibliography field. Because there's never other content in this field, I'm save to replace them all.

{{ entry.articleBibliography|markdown|replace({'<ul>': '<ul class="Bibliography">'})|raw }}


Update: You can also use the awesome Retcon plugin for this, it’s using DomDocument internally so the result should be more reliable.

{{ entry.articleBibliography|markdown|retconAttr('ul', {'class': 'Bibliography'}) }}
  • How can I add a class to an anchor? This works, but I obviously don't want to hardcode href and title. Any ideas? ``` {{ block.text|markdown|replace({'<a href="example.com" title="example.com">': '<a href="example.com" class="my-class" title="example.com">'})|raw }} ``` Sep 29 '17 at 12:24
  • @AndreaDeMers please see my update to the answer
    – carlcs
    Sep 29 '17 at 13:17

You could put the class on the parent element, and then target .Bibliography > ul in your css.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.