Partial inside of shortcode not renering as expected

I am trying to create a shortcode that places text (markdown) next to a partial.

I can either get the markdown to render properly or the partial, but not both. If I use {{%…%}}, the markdown is correct, and the partial is broken. If I use {{<…>}} the markdown does not render, but the partial works fine.

My shortcode “side_by_side.html” looks like this.

<div class="sbs-container">
    <div class="sbs-item">
        {{ partial (.Get 0) }}
    </div>

    <div class="sbs-item">
        {{.Inner}}
    </div>
</div>

And I use it in my markdown file like this:

{{% side_by_side "stl.html" %}}
    ## Headding
    Followed by paragraphs of text
{{% /side_by_side %}}

In this case “stl.htm” contains stl data that I apply css to later, but it could be any html

I guess using percent signs causes the partial to be rendered as markdown instead of html?

I’m stuck and any help would be appreciated!

Cheers,
Chris

And… immediately after posting I found the solution…

So for my example above becomes:

<div class="sbs-container">
    <div class="sbs-item">
        {{ partial (.Get 0) }}
    </div>

    <div class="sbs-item">
        {{.Inner | markdownify }}
    </div>
</div>

and call using {{<…>}}

{{< side_by_side "stl.html" >}}
    ## Headding
    Followed by paragraphs of text
{{< /side_by_side >}}

Edit:
Was helped by this post:

In my view .RenderString is always a better choice than markdownify. Because it is a method on .Page you would invoke it within a shortcode like this:

{{ .Inner | .Page.RenderString }}

The documentation on RenderString says (about the display option):
If inline (default), surrounding <p></p> on short snippets will be trimmed.

Are the \<p> tags not removed on long snippets? And how short is “short”? Sometimes reading the documentation leaves me with more questions than I had before.

The “surrounding p-tags” relates to Markdown creating paragraphs for even a single line if it’s going to be rendered. So if your string is for instance a button text, then tell Hugo to do it inline and it won’t have p-tags around it. If it’s a paragraph, then tell Hugo to do it as block and the p-tags will be kept.

If it’s lots of Markdown it will render to what the markdown is about, without “extra” p-tags around. This is only about short strings.

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