Semantic markdown blocks
135 words, 1-minute read
Elements such as <aside>
, <section>
, and <article>
cannot be expressed in markdown unless you create a block of HTML content. Unfortunately, this means child markdown is not converted to HTML. For example:
markdown input
<aside>
See also:
* [link one](#one)
* [link two](#two)
* [link three](#three)
</aside>
renders the HTML exactly as shown.
The following processContent
hook function translates ${ tag }
… ${ /tag }
, where tag
can be aside
, section
, or article
.
publican.config.processContent.add( data => {
data.content = data.content
.replace(/{\s*(\/{0,1}aside|section|article)\s*\}/gi, '<$1>')
.replace(/<p><(aside|section|article)><\/p>/gi, '<$1>')
.replace(/\n<(.+?)><(aside|section|article)>\s/gi, '\n<$2><$1>')
.replace(/\n<\/(aside|section|article)><\/(.+?)>\n/gi, '</$2></$1>\n');
}
Converting <aside>
tags to use {
and }
brackets in the example above now outputs:
HTML output
<aside>
<p>See also:</p>
<ul>
<li><a href="#one">link one</a></li>
<li><a href="#two">link two</a></li>
<li><a href="#three">link three</a></li>
<ul>
</aside>