Hugo doesn't translate markdown with my code

support
1

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:

2

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

3

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 ?

4

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

5

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>
6

This worked exactly as expected !! Thanks a lot !