Empty <p> </p> tags generated when using shortcodes

Hi there,

I have created 2 shortcodes:

One called “topic”:

<div id="{{ .Get 0 }}">{{ .Inner }}</div>

and another called “h2”

<h2 {{ with .Get "class"}}class="{{.}}"{{ end }}>{{.Inner}}</h2>

When I use this markdown code:
{{% topic "topic1" %}} {{<h2 class="superbold title-txt">}}Paragraph title{{</h2>}}' 'Blabla' {{% /topic %}}

Hugo generates this HTML code:
`

Paragraph title

Blabla

`

with all these empty p tags everywhere.
Any idea why ?

I have also noticed that when using {{ .Content }} in a template, all the content is wrapped between p tags even if I have already wrapped my content with p tags.

For example:
<p class="light-txt">{{ .Content}}</p>
generates:
<p class="light-txt"><p>My generated content</p></p>

Is it possible to avoid these additionnal markups ?

Best regards
Geraud

This is a known issue, there are some workaround, use the search here and on GitHub.

Yep. Thanks

#1642

Hi everyone,

You can use the pseudo-class css :empty like this

p:empty {display:none;}

The browser support is correct

4 Likes