Markdownify function with nested shortcodes

I have an issue that is either due to my poor understanding of nested shortcodes, or my poor understanding of markdown (or probably both.)

This is an internal site so I don’t have a repository but I’ve recreated a basic representation below. Essentially this is an attempt to style some text and a couple images in a drop shadow.

I’m using the shortcode’s “Inner” feature as I would like to include text with multuiple lines. I have done that with other shortcodes with no issue in the past but this time it is complicated by having a nested image shortcode in that same text block.

So, my box_shadow_text.html shortcode:

<div class="myclass">
  <h3>{{ .Get "header_text" }}</h3>
  <p>{{ .Inner | markdownify }}</p>
</div>

My simple_img.html shortcode

{{ with .Parent }}
    {{ $src := .Page.Resources.GetMatch (printf "%s" ($.Get "src")) }}
    {{ with $src }}
        <img src="{{ .RelPermalink }}">
    {{ end }}
{{ else }}
    {{ $src := .Page.Resources.GetMatch (printf "%s" ($.Get "src")) }}
    {{ with $src }}
        <img src="{{ .RelPermalink }}">
    {{ end }}
{{end}}

… and the index.md page

---
title: "MyTitle"
---

{{< box_shadow_text header_text="Header" >}}This is some text..
.. that I would like to display..

.. with multiple paragraphs.

{{< simple_img src="image_folder/image1jpg" >}}
{{< simple_img src="image_folder/image2jpg" >}}

{{</ box_shadow_text >}}

My problem is that when I use the markdownify function on the .Inner text in my box_shadow_text.html shortcode the text appears correctly but the images appear as inline HTML code which kind of makes sense. If I remove the markdownify I get the images as expected but the text is just one massive block without paragraph tags, which also kind of makes sense. I want the img tags from the simple_img.html shortcode to be exempt from the markdownify function.

I found this forum post which initially looks like the same problem I’m having but using safeHTML on the .Inner block results in the same output as removing markdownify - the images show up but the text has no paragraph tags.

I’ve tried all manner of fixes but still can’t make this work. So, for now I’ve resorted to splitting the shortcode into two individual files:

So, now I have a box_shadow_text_begin.html shortcode:

<div class="myclass">
  <h3>{{ .Get "header_text" }}</h3>
  <p>

and a box_shadow_text_end.html shortcode:

</p>
</div>

It’s ugly and I hate it but it’s the only way it works. I should probably lower my expectations and rethink things to avoid nesting shortcodes in the first place.

2 Likes