index.md (1912B)
1 --- 2 date: 2017-04-16T13:53:58-04:00 3 categories: ["Releases"] 4 description: "Hugo 0.20.2 adds support for plain text partials included into HTML templates" 5 link: "" 6 title: "Hugo 0.20.2" 7 draft: false 8 author: bep 9 aliases: [/0-20-2/] 10 --- 11 12 Hugo `0.20.2` adds support for plain text partials included into `HTML` templates. This was a side-effect of the big new [Custom Output Format](https://gohugo.io/extras/output-formats/) feature in `0.20`, and while the change was intentional and there was an ongoing discussion about fixing it in [#3273](//github.com/gohugoio/hugo/issues/3273), it did break some themes. There were valid workarounds for these themes, but we might as well get it right. 13 14 The most obvious use case for this is inline `CSS` styles, which you now can do without having to name your partials with a `html` suffix. 15 16 A simple example: 17 18 In `layouts/partials/mystyles.css`: 19 20 body { 21 background-color: {{ .Param "colors.main" }} 22 } 23 24 Then in `config.toml` (note that by using the `.Param` lookup func, we can override the color in a page’s front matter if we want): 25 26 {{< code-toggle file="config" >}} 27 [params] 28 [params.colors] 29 main = "green" 30 text = "blue" 31 {{< /code-toggle >}} 32 33 And then in `layouts/partials/head.html` (or the partial used to include the head section into your layout): 34 35 <head> 36 <style type="text/css"> 37 {{ partial "mystyles.css" . | safeCSS }} 38 </style> 39 </head> 40 41 Of course, `0.20` also made it super-easy to create external `CSS` stylesheets based on your site and page configuration. A simple example: 42 43 Add “CSS” to your home page’s `outputs` list, create the template `/layouts/index.css` using Go template syntax for the dynamic parts, and then include it into your `HTML` template with: 44 45 {{ with .OutputFormats.Get "css" }} 46 <link rel="{{ .Rel }}" type="{{ .MediaType.Type }}" href="{{ .Permalink | safeURL }}"> 47 {{ end }}`