Как добавить класс CSS в абзац в Hugo

[Изменить] Мой первоначальный ответ приведен ниже, но вот лучший ответ для всех, кто сталкивается с этой проблемой.

Hugo использует Goldmark для синтаксического анализа уценки и по умолчанию устанавливает для разметки > goldmark > renderer > unsafe значение «false». Это означает, что если вы смешаете HTML с уценкой, Hugo выдаст ошибку вместо рендеринга HTML.

Если вы измените параметр «небезопасно» на «истина», Hugo отобразит ваш HTML. Вы делаете этот параметр в своем файле config.yaml (или config.toml или config.json, в зависимости от того, что вы используете). Для получения информации о том, как применить этот параметр, см. https://gohugo.io/getting-started/configuration-markup/#goldmark.

Обратите внимание, что когда unsafe=true, вы можете сломать макет страницы, если напишете плохой HTML. Однако обычно вы просто хотите добавить что-то вроде [div class="whatever"][/div]. Большинство людей достаточно умны, чтобы не облажаться.

[Исходный ответ] На самом деле это заноза в заднице. Вам нужно создать свой собственный шорткод. В каталоге вашего проекта Hugo создайте файл с именем attr.html в следующем месте:

/layouts/shortcodes/attr.html

Затем поместите это в attr.html:

<p
    {{ if .Get "class"}}class = "{{ .Get "class" }}"{{ end }}
    {{ if .Get "id" }}id = "{{ .Get "id" }}"{{ end }}
    {{ if .Get "name" }}name = "{{ .Get "name" }}"{{ end }}
    {{ if .Get "style" }}style = "{{ .Get "style" }}"{{ end }}
>{{ .Inner }}</p>

Затем, вернувшись к файлу уценки, сделайте следующее:

{{< attr class = ".font-normal .text-lg" >}}This is some paragraph text.{{< /attr >}}

Вы должны получить этот вывод:

<p class = ".font-normal .text-lg">This is some paragraph text.</p>

Приведенный выше шорткод также поддерживает атрибуты id, name и style. Если вам нужно больше, вам придется добавить их в шаблон шорткода. Также обратите внимание, что этот шаблон предполагает, что вы хотите использовать теги "p" в своем выводе.

Глядя на документацию , вы можете видеть, что значение по умолчанию для блока в [markup.goldmark.parser.attribute] равно false. Вам нужно установить это значение на true:

config.toml

[markup]
  [markup.goldmark]
    [markup.goldmark.parser]
      [markup.goldmark.parser.attribute]
        block = true

Например, этот абзац:

This is some paragraph text.
{.font-normal .text-lg}

отображается с помощью block = false следующим образом:

<p>This is some paragraph text.
{.font-normal .text-lg}</p>

_{(like the example in the question)}

и с block = true вот так:

<p class = "font-normal text-lg">This is some paragraph text.</p>

Проверено на Hugo v0.108.0+extended linux/amd64 BuildDate=unknown.

_{PS: There is no need to set unsafe = false in [markup.goldmark.renderer], in this case.}