Using Hugo Variables with Alpine
Not only using Hugo’s variables with Go template language, but also Alpine’s directive.
Using range to Iterate over an Array
The Go Templates make heavy use of range to iterate over a Map, Array, or Slice.
Using Site Variables to Store Custom Data
For site-level custom data, we can store them on the params section of config.json.
Using .Content to Access Markdown Content
We can use .Content page variable to access Markdown content.
Using relref to Get Relative Permalink
We can use relref to get the relative permalink to a page for the href attribute of <a>.
Using ref to Get Absolute Permalink
We can use ref to get the absolute permalink to a page for the href attribute of <a>.
Using markdownify to transform Makrdown to HTML
If we use Markdown to define a variable, we can use markdownify to transform Markdown to HTML.
Using humanize to Capitalize the String
Hugo provides humanize function to make a String with the first letter capitalized.
Using .Param to access User-defined Variable
For user-defined variable, we can either define it as site variable or page variable. $.Param reads page variable first. If it doesn’t exist, then read site variable.