Using Hugo Variables with Alpine
Not only using Hugo’s variables with Go template language, but also Alpine’s directive.
タグ : Hugo
Minimizing HTML under Production
Minimizing HTML is provided by Hugo. We can minimize HTML under production.
Integrating TailwindCSS with Hugo
TailwindCSS is great for JAMstack, but we have to integrate TailwindCSS with Hugo manually.
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.
Site Variable Overview
We can define site variables in config.json and access them by Go template language.
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 pipe for Function Pipeline
We can use the | operator to compose multiple functions for Function Pipeline.
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 with to Change the Context
We can use with to change the context and . as the context variable.
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.
Using default to Provide the Default Value
We can use default to provide the default value of the template variable instead of using if else.
Using if else for Truthy Value
We can use if else for truthy/falsy value in Go template language.