Merge commit 'eb738cd35cca1ffc68c5ed688dbe2a19108e8761'
|
@ -12,6 +12,8 @@ sections_weight: 10
|
|||
draft: false
|
||||
aliases: []
|
||||
toc: true
|
||||
images:
|
||||
- images/blog/sunset.jpg
|
||||
---
|
||||
|
||||
|
||||
|
@ -119,6 +121,35 @@ Image operations in Hugo currently **do not preserve EXIF data** as this is not
|
|||
{{% /note %}}
|
||||
|
||||
|
||||
### Image Processing Examples
|
||||
|
||||
_The photo of the sunset used in the examples below is Copyright [Bjørn Erik Pedersen](https://commons.wikimedia.org/wiki/User:Bep) (Creative Commons Attribution-Share Alike 4.0 International license)_
|
||||
|
||||
|
||||
{{< imgproc sunset Resize "300x" >}}
|
||||
|
||||
{{< imgproc sunset Fill "90x120 left" >}}
|
||||
|
||||
{{< imgproc sunset Fill "90x120 right" >}}
|
||||
|
||||
{{< imgproc sunset Fit "90x90" >}}
|
||||
|
||||
{{< imgproc sunset Resize "300x q10" >}}
|
||||
|
||||
|
||||
This is the shortcode used in the examples above:
|
||||
|
||||
|
||||
{{< code file="layouts/shortcodes/imgproc.html" >}}
|
||||
{{< readfile file="layouts/shortcodes/imgproc.html" >}}
|
||||
{{< /code >}}
|
||||
|
||||
And it is used like this:
|
||||
|
||||
```html
|
||||
{{</* imgproc sunset Resize "300x" */>}}
|
||||
```
|
||||
|
||||
### Image Processing Options
|
||||
|
||||
In addition to the dimensions (e.g. `200x100`) where either height or width can be omitted, Hugo supports a set of additional image options:
|
BIN
docs/content/about/new-in-032/sunset.jpg
Normal file
After Width: | Height: | Size: 88 KiB |
|
@ -19,6 +19,14 @@ toc: true
|
|||
|
||||
{{< youtube 0GZxidrlaRM >}}
|
||||
|
||||
## Content Bundles and Image Processing
|
||||
|
||||
See [This Page](/about/new-in-032/). We will get the relevant parts of the rest of the Hugo docs updated. Eventually.
|
||||
|
||||
{{< todo >}}
|
||||
Remove the above when done.
|
||||
{{< /todo >}}
|
||||
|
||||
## Organization of Content Source
|
||||
|
||||
In Hugo, your content should be organized in a manner that reflects the rendered website.
|
||||
|
|
|
@ -1,10 +1,12 @@
|
|||
|
||||
---
|
||||
date: 2017-12-31
|
||||
title: "0.32"
|
||||
description: "0.32"
|
||||
slug: "0.32"
|
||||
title: "Hugo 0.32: Page Bundles and Image Processing!"
|
||||
description: "Images and other resources with page-relative links, resize, scale and crop images, and much more."
|
||||
slug: "0.32-relnotes"
|
||||
categories: ["Releases"]
|
||||
images:
|
||||
- images/blog/hugo-32-poster.png
|
||||
---
|
||||
|
||||
Hugo `0.32` features **Page Bundles and Image Processing** by [@bep](https://github.com/bep), which is very cool and useful on so many levels. Read about it in more detail in the [Hugo documentation](https://gohugo.io/about/new-in-032/), but some of the highlights include:
|
||||
|
|
|
@ -1,17 +1,14 @@
|
|||
|
||||
---
|
||||
date: 2018-01-02
|
||||
title: "0.32.1"
|
||||
description: "0.32.1"
|
||||
slug: "0.32.1"
|
||||
title: "0.32.1: Two bugfixes"
|
||||
description: "Fixes image processing in shortcodes."
|
||||
slug: "0.32.1-relnotes"
|
||||
categories: ["Releases"]
|
||||
images:
|
||||
- images/blog/hugo-bug-poster.png
|
||||
|
||||
---
|
||||
|
||||
|
||||
|
||||
This fixes 2 bugs from the Hugo 0.32 release.
|
||||
|
||||
* Fix image processing from shortcodes in non-server mode. [@bep](https://github.com/bep) [#4202](https://github.com/gohugoio/hugo/issues/4202)
|
||||
|
|
|
@ -191,7 +191,7 @@ Any other value defined in the front matter in a content file, including taxonom
|
|||
```
|
||||
---
|
||||
title: My First Post
|
||||
date: date: 2017-02-20T15:26:23-06:00
|
||||
date: 2017-02-20T15:26:23-06:00
|
||||
categories: [one]
|
||||
tags: [two,three,four]
|
||||
```
|
||||
|
|
19
docs/layouts/shortcodes/imgproc.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
{{ $original := .Page.Resources.GetByPrefix (.Get 0) }}
|
||||
{{ $command := .Get 1 }}
|
||||
{{ $options := .Get 2 }}
|
||||
{{ if eq $command "Fit"}}
|
||||
{{ .Scratch.Set "image" ($original.Fit $options) }}
|
||||
{{ else if eq $command "Resize"}}
|
||||
{{ .Scratch.Set "image" ($original.Resize $options) }}
|
||||
{{ else if eq $command "Fill"}}
|
||||
{{ .Scratch.Set "image" ($original.Fill $options) }}
|
||||
{{ else }}
|
||||
{{ errorf "Invalid image processing command: Must be one of Fit, Fill or Resize."}}
|
||||
{{ end }}
|
||||
{{ $image := .Scratch.Get "image" }}
|
||||
<figure style="width: {{ add $image.Width 3 }}px; padding: 3px; background-color: #cccc">
|
||||
<img src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}">
|
||||
<figcaption>
|
||||
<small>.{{ $command }} "{{ $options }}"</small>
|
||||
</figcaption>
|
||||
</figure>
|
|
@ -3,15 +3,15 @@
|
|||
command = "hugo"
|
||||
|
||||
[context.production.environment]
|
||||
HUGO_VERSION = "0.31.1"
|
||||
HUGO_VERSION = "0.32.1"
|
||||
HUGO_ENV = "production"
|
||||
HUGO_ENABLEGITINFO = "true"
|
||||
|
||||
[context.deploy-preview.environment]
|
||||
HUGO_VERSION = "0.31.1"
|
||||
HUGO_VERSION = "0.32.1"
|
||||
|
||||
[context.branch-deploy.environment]
|
||||
HUGO_VERSION = "0.31.1"
|
||||
HUGO_VERSION = "0.32.1"
|
||||
|
||||
[context.next.environment]
|
||||
HUGO_BASEURL = "https://next--gohugoio.netlify.com/"
|
||||
|
|
After Width: | Height: | Size: 1.9 KiB |
After Width: | Height: | Size: 5 KiB |
After Width: | Height: | Size: 1.7 KiB |
After Width: | Height: | Size: 1.6 KiB |
After Width: | Height: | Size: 1.3 KiB |
BIN
docs/static/images/blog/sunset.jpg
vendored
Normal file
After Width: | Height: | Size: 88 KiB |