Гюго: объединение диапазонов данных и коротких кодов

Question

У Хьюго есть шорткод на YouTube. Я хотел бы использовать его в сочетании с шаблонами данных, чтобы показать список видео, которые управляются содержимым файла JSON.

В идеале, в site/content/index.md Я хотел бы что-то вроде этого:

# Some YouTube videos
{{ range $.Site.Data.youtube.videos }}
    {{< youtube .id >}}
{{ end }}

И в site/data/youtube.yml Я хотел бы что-то вроде этого:

---
videos:
- id: abc123
- id: xyz456

так что каждый из идентификаторов видео, которые я перечисляю в моем .yml файл отображается как встроенное видео YouTube на моей домашней странице.

Проблема в том, что я не могу использовать такие функции, как range в .md файлы. Когда я пытаюсь это сделать, первый фрагмент кода просто отображается как текст, а не заменяется видео YouTube:

Справедливо, давайте выделим код в партиал, который живет в site/layouts/partials/youtube-list.html:

{{ range $.Site.Data.youtube.videos }}
    {{< youtube .id >}}
{{ end }} 

Тогда мы изменим site/content/index.md для ссылки на частичное:

# Some YouTube Videos
{{ partial "youtube-list.html" . }}

Теперь, когда я пытаюсь запустить сервер, Хьюго говорит мне, что я не могу использовать < персонаж в частичном:

ERROR 2018/01/05 11:30:33 partials/youtube-list.html : template: partials/youtube-list.html:2: unexpected "<" in command

Отлично. Я полагаю, что вместо этого я мог бы создать собственный шорткод, но они, похоже, имеют то же ограничение - шорткод не может ссылаться на другой шорткод:

ERROR 2018/01/05 11:32:39 shortcodes/youtube-list.html : template: shortcodes/youtube-list.html:3: unexpected "<" in command

Думаю, я мог бы найти источник шорткода YouTube в репозитории Hugo GitHub и "одолжить" его оптом для использования в моем новом шорткоде, но это выглядит как ненужное дублирование кода.

tl; dr: есть ли способ объединить шаблоны данных и шорткоды в Hugo, чтобы один и тот же шорткод использовался для визуализации каждого элемента в списке, который читается из шаблона данных?

Answer 1

Невозможно получить доступ к шорткоду из ваших партиалов так, как вы пытаетесь его настроить.

альтернатива

Hugo позволяет вам вызывать частичные номера из ваших коротких номеров, как вы упомянули. Хотя установка не совсем так, как вы пытаетесь их выложить, вы можете создать частичные компоненты многократного использования, которые будут принимать $.Params и позволят вам приблизиться к тому, что вы пытаетесь выполнить.

• Разрешить шорткоду вызывать любой доступный шорткод частичный компонент для повторного использования
• Каждый частичный компонент должен выделяться как отдельный повторно используемый шорткод или шаблон из макетов.

Создайте место для ваших частичных компонентов. В этом примере используйте layouts/partials/component

Создайте шаблон видео для YouTube, как в коротком коде, но используйте переданный $.Params в качестве контекста для компонента. Мы увидим это в примере ниже.

layouts/partials/component/youtube.html

<div>
  <iframe width="560" height="315" src="https://www.youtube.com/embed/{{ .id }}" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</div>

Создать шорткод layouts/shortcodes/youtube-sc.html

{{ if .IsNamedParams }}
{{- partial "component/youtube" $.Params -}}
{{- end -}}

Позвоните по шорткоду с передней позиции уценки content/example.md:

---
title: Youtube example
---

{{< youtube-sc id="2xkNJL4gJ9E" >}}

Повторно использовать layouts/partials/youtube.html компонент в шорткоде списка:

layouts/shortcodes/youtube-list.html

{{ if .IsNamedParams }}
  {{ $data := index $.Site.Data.youtube $.Params.data }}
  {{ range $data }}
    <h2>Video is {{ .id }}</h2>
    {{ partial "component/youtube" . }}
  {{ end }}
{{- end -}}

Позвоните по шорткоду с передней позиции уценки content/example.md:

---
title: Youtube List Example
---

{{< youtube-list data="videos" >}}

Данные могут включать несколько списков и вызываться на основе списка видео, которые вы хотите с {{< youtube-list data="others" >}} с помощью:

---
videos:
- id: 2xkNJL4gJ9E
- id: FyPgSuwIMWQ
others:
- id: ut1xtRZ1QOA
- id: sB0HLHjgQ7E

ПРИМЕЧАНИЕ. В этом примере предполагается использование NamedParams в ваших коротких кодах, чтобы сделать его чище. Вы можете добавить данные в data объекты и также передать это в именованные параметры шорткода.

Answer 2

Вы можете создать плейлист на YouTube и встроить this.