Hugo doesn't translate markdown with my code

Hi there,
I’m curently using my own custom theme and my issue is quite simple, I reproduced it here :

my first google link is not translated to html but this second is. I guess it’s because of my html code ?
my md file looks like this

{{< textfont >}}
some texte
[google](https://google.com)
{{< /textfont >}}
[google](https://google.com)

I missed some things which are not interesting in this case ; my textfont shortcode looks like this :

<div class="text-muted text-article">{{.Inner}}</div><p>
</div>

my text-muted and text-article css :

.text-article {
    font-size: 1.5em;
    max-width: 40%;
    margin-right: none;
}

.text-muted {
    color: #6c757d!important;
    font-family: "Ubuntu-Regular"!important;
}

I think I’ve given all needed ? The html code is available in the link I just gave by pressing ctrl+U.
Thanks for reading, and thanks by advance to help me :slight_smile:

The shortcode seems to generate invalid HTML: you close the div, then you open a p and close a div immediately afterwards.

I did this weird thing because hugo writes automatically </p> just after the shortcode you’re talking about (hugo writes <p> before which I close too with a first shortcode). Maybe there are cleaner way to do this ?

In fact the <p></p> hugo creates are useful in this case :

(check the source code)
but I think my problem would be solved if it didn’t generate these balises

If you want your shortcode to render the inner content from markdown to HTML, you need to pass it through the .RenderString method.

layouts/shortcodes/textfont.html

<div class="text-muted text-article">{{ .Inner | .Page.RenderString }}</div>

This worked exactly as expected !! Thanks a lot !

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