Shortcode: rendering markdown inside html tags

I have a shortcode test-no-params like this:

{{/* shortcode test-no-params */}}

{{ with .Inner -}}
<div>{{ . -}}</div>
{{ end -}}

When I call this shortcode with {{% test-no-params %}}**bold**{{% test-no-params %}} syntax I don’t see the markup rendered:

<div>**bold**</div>

This is due to the fact that according to the markdown spec, markdown code inside <div> tags is left as is.

To work around this and get the narkdown rendered, I modified the shortcode (let’s call the new modified shortcode test-with-params) by introducing a named shortcode parameter markdown which needs to be set to true in case of {{% syntax:

{{/* shortcode test-with-params */}}

{{ $markdown := default false (.Get "markdown") }}
{{ with .Inner -}}
{{ if $markdown -}}
<div>{{ . | markdownify -}}</div>
{{ else -}}
<div>{{ . -}}</div>
{{ end -}}
{{ end -}}

When running the modified shortcode via {{% test-with-params markdown=true %}}**bold**{{% test-with-params %}}, markdown is rendered now:

<div><strong>bold</strong></div>

while {{< test-with-params markdown=true >}}**bold**</b>{{< test-with-params >}} outputs the raw, unrendered markdown:

<div>**bold**</div>

No my question: Is there a way to get the same behaviour of shortcode test-with-params with a shortcut that does not rely on any shortcode parameter? Thanks for any ideas.

View source (typically Ctrl+U) in your browser. What do you see instead of the rendered shortcode?

I shortened and rephrased my description to make my issue clearer. In short: shortcode test-with-params given above does exactly what I want. Is there a way to achieve the same with a shortcode has no parameters (and works both with {{% ... and {{< ... shortcode syntax?).

That depends on how you close the HTML block:
https://spec.commonmark.org/0.30/#html-blocks

See close condition under HTML block type #7.

Same line

markdown

<div>**bold**</div>

rendered

<div>**bold**</div>

Separate lines, no line breaks

markdown

<div>
**bold**
</div>

rendered

<div>
**bold**
</div>

Separate lines, blank line closes HTML block

markdown

<div>

**bold**
</div>

rendered

<div>
<p><strong>bold</strong></p>
</div>

This markdown-to-HTML playground uses the reference implementation:
https://spec.commonmark.org/dingus/

That was exactly what I was looking for and solves my problem.
Thanks a lot for the link to the spec, very much appreciated!

1 Like

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.