youtube in tab broken

[aCuria]

I realized that using {{< youtube ...>}} inside a {{< tab ... >}} does not work for some reason.

It does work outside the tab.

[alex-shpak]

Hi! Unfortunately I don't think I can fix it on theme side.
Looks like youtube shortcode generates whitespaces (indentation) and markdown renderer turn it into blockquote

[pasabanov]

I couldn't reproduce the issue using the {{< >}} syntax:

{{< tabs >}}
  {{< tab 123 >}}
    {{< youtube 0RKpf3rK57I >}}
  {{< /tab >}}
  {{< tab 234 >}}
    {{< youtube 0RKpf3rK57I >}}
  {{< /tab >}}
{{< /tabs >}}

, but I've managed to reproduce it using the {{% %}} syntax either in tab or tabs:

{{< tabs >}}
{{< tab 123 >}}
{{< youtube 0RKpf3rK57I >}}
{{< /tab >}}
{{% tab 234 %}}
{{< youtube 0RKpf3rK57I >}} <!-- broken -->
{{% /tab %}}
{{< /tabs >}}

{{% tabs %}}
{{< tab 123 >}}
{{< youtube 0RKpf3rK57I >}} <!-- broken -->
{{< /tab >}}
{{< tab 234 >}}
{{< youtube 0RKpf3rK57I >}} <!-- broken -->
{{< /tab >}}
{{% /tabs %}}

Removing the indentation in layouts/shortcodes/tab.html doesn't solve the issue.

It is possible to copy the builtin youtube.html file and modify it by removing the indentation. I verified that this solves the problem.
It may be worth creating an issue in the Hugo repository.

[pasabanov]

The issue can also be solved by replacing {{- .Inner -}} in layouts/shortcodes/tab.html by {{- .Inner | strings.TrimSpace | .Page.RenderString -}}, but it may break the formatting of other content that depends on indentation.

[alex-shpak]

Hello!
Yes, .Page.RenderString will help with rendering youtube shortcode, but it will lead to issues,
.Page.RenderString will render markdown in new context, so headers and footnotes would not be carried into page,

A bit of time ago I changed from RenderString here
925dbd3

To have better support for ToC and Footnotes, tho, you can add editer or alternative shortcode in your site