Hugo嵌套shortcode调用markdownify时内容被<pre>包裹渲染异常

渲染异常由两个问题共同导致：

• 用{{< >}}格式调用shortcode时，Hugo默认不会自动剥离内容的前置缩进。你写调用代码时，子shortcode内的列表项前面带了多层缩进，行首空格数达到Markdown代码块的触发阈值（默认4个空格），直接被解析器识别为代码块，包裹进<pre><code>标签输出。
• 父级shortcode直接输出.Inner未做安全渲染处理，嵌套场景下内层shortcode的Markdown解析上下文异常，导致内容解析规则失效。

1. 修改父级shortcode代码 #

将直接输出.Inner的逻辑替换为安全渲染，高版本Hugo可直接调用内置方法剥离公共缩进，修改后代码：

<section class="row td-box td-box--height-auto usage">
    <div class="col">
        <h2>{{ with .Get "heading" }}{{.}}{{end}}</h2>
        {{/* Hugo 版本 >= 0.101.0 用下面这行 */}}
        {{ .Inner.Deindent | safeHTML }}
        {{/* 版本低于0.101.0 就用这行，替换上面的Deindent逻辑 */}}
        {{/* .Inner | safeHTML */}}
    </div>
</section>

2. 修改子级shortcode代码 #

渲染内部Markdown前先剥离内容首尾的换行、空格，避免多余空白干扰解析，修改后代码：

<div class='col-lg-6 mb-5 mb-lg-0 {{ with .Get "class" }}{{.}}{{end}}'>
    <h3>{{ with .Get "class" }}{{.}}{{end}}</h3>
    {{ .Inner | trim "\n\r " | markdownify | safeHTML }}
</div>

3. 低版本Hugo兼容调整 #

如果使用0.101.0以下版本、不支持.Deindent方法，写shortcode调用时不要给内层内容加多余缩进，参考写法：

{{< usagepane heading="Usage" >}}
{{< usage class="do" >}}
* test 1
{{< /usage >}}
{{< usage class="dont" >}}
* test 2
{{< /usage >}}
{{< /usagepane >}}

修改后内层Markdown列表会被正确解析为<ul><li>结构，不会再被转成代码块，预期输出HTML：

<section class="row td-box td-box--height-auto usage">
    <div class="col">
        <h2>Usage</h2>
        <div class="col-lg-6 mb-5 mb-lg-0 do">
            <h3>do</h3>
            <ul>
                <li>test 1</li>
            </ul>
        </div>
        <div class="col-lg-6 mb-5 mb-lg-0 dont">
            <h3>dont</h3>
            <ul>
                <li>test 2</li>
            </ul>
        </div>
    </div>
</section>

内容的提问来源于stack exchange，提问作者Jason