Esse post é mais uma história sobre como eu usei o Hugo e suas funcionalidades. 🤠
Eu estou criando um site para algo da minha pesquisa (em breve divulgo por aqui) onde eu tenho que gerar várias páginas a partir de arquivos JSON para um site de páginas estáticas. Só nesse blog aqui eu uso o Hugo desde 2018 e, embora tenham outras opções ótimas por aí, eu acabo sempre tentando fazer as coisas com ele.
Uma alternativa para um problema similar é o Data Templates e eu mesma já me aventurei, usando o Google Sheets como backend. Mas ao invés de criar uma página apenas, eu queria criar várias. Para isso encontrei uma solução com o Content Adapters.
O Content adapters permite que você crie um conteúdo dinamicamente, seja adicionando uma página ou um recurso. O meu problema era: eu tenho um JSON grandão com uma lista de coisas (definitions
) que eu quero que vire uma página cada uma, a partir de um markdown pré-estabelecido.
A documentação cobre casos básicos mas como eu tive que bater cabeça até funcionar, achei que valia a pena compartilhar o passo a passo. Vamo lá!
Prepare o seu template
Eu criei a página (markdown) do jeito que eu queria, já que todas tem a mesma estrutura, e coloquei em assets/definitions.md
com placeholders nos lugares onde as informações do JSON dariam lugar. Por exemplo:
# TITLE
By ORGANIZATION - AUTHORS
## Purpose
DESCRIPTION
Dica: aqui você não coloca aquele cabeçalho; ele vai ser inserido mais tarde.
Prepare os dados
Para ter dados acessíveis, criei uma pastinha data/definitions.json
com uma lista de JSONs que eu gostaria de usar. Mas você pode usar um endereço remoto para acessar esse JSON também. Deve ser uma lista de JSONs.
Finalmente, o adapter
Em content/
, criei uma pasta para definitions
e dentro dela um _content.gotmpl
. Você precisa de um _index.md
também (não deixa de ver a doc oficial!).
content/
└── definitions
├── _content.gotmpl
└── _index.md
No _content.gotmpl
que guarda o pulo do gato: carrego o meu definitions.md
e itero sobre eles fazendo a substituição dos dados do JSON pelos placeholders da página. Ao rodar o hugo server
todas as páginas são criadas.
{{ with resources.Get "definitions.md" }}
{{ $definitionTemplate := .Content }}
{{ range $.Site.Data.definitions }}
{{ $publishedAt := dict }}
{{ if .published_at }}
{{ $publishedAt := dict "date" (time.AsTime .published_at) }}
{{ end }}
{{ $dates := dict "date" now.UTC }}
{{ $processedContent := replace $definitionTemplate "TITLE" .title }}
{{ if .authors }}
{{ $processedContent = replace $processedContent "AUTHORS" (delimit .authors ", ") }}
{{ else }}
{{ $processedContent = replace $processedContent " - AUTHORS" "" }}
{{ end }}
{{ $processedContent = replace $processedContent "ORGANIZATION" .organization }}
{{ $processedContent = replace $processedContent "DESCRIPTION" .description }}
{{ $processedContent = replace $processedContent "DEFINITION" ( . | jsonify (dict "prefix" " " "indent" " ")) }}
{{ $content := dict
"mediaType" "text/markdown"
"value" $processedContent
}}
{{ $page := dict
"content" $content
"kind" "page"
"path" .title
"title" .title
"dates" $dates
"publishDate" .publishedAt
"draft" false
}}
{{ $.AddPage $page }}
{{ end }}
{{ end }}
Mas, pera, não tem nenhum markdown novo na pasta.
É isso mesmo. Ele gera os arquivos (conteúdo) apenas com base no template que você passou.
Espero que essa receitinha de bolo te ajude!
Links que me ajudaram: https://gohugo.io/content-management/content-adapters/ https://github.com/gohugoio/hugo/issues/12427 https://www.thenewdynamic.com/article/toward-using-a-headless-cms-with-hugo-part-2-building-from-remote-api/