diff options
author | Asur <asur@asurbernardo.com> | 2020-02-17 14:41:28 +0300 |
---|---|---|
committer | Asur <asur@asurbernardo.com> | 2020-02-17 14:41:28 +0300 |
commit | 5b3a51aaea8658924c1c92c00e32c834dac78292 (patch) | |
tree | e5122a8f72b4337a4e2715509e832987660dbf99 | |
parent | 40c3872a0c88ca256bbdda46f18db28a87b47a48 (diff) |
Use images as resources instead of as static files
-rw-r--r-- | layouts/partials/blocks/image.html | 23 | ||||
-rw-r--r-- | layouts/partials/shortcodes/amp-image.html | 21 |
2 files changed, 24 insertions, 20 deletions
diff --git a/layouts/partials/blocks/image.html b/layouts/partials/blocks/image.html new file mode 100644 index 0000000..c6424c8 --- /dev/null +++ b/layouts/partials/blocks/image.html @@ -0,0 +1,23 @@ +<figure class="figure {{ with .caption }}figure--with-caption{{ end }}"> + {{ with .caption }} + <figcaption class="figure__caption"> + {{ . }} + </figcaption> + {{ end }} + {{ $resource := resources.Get .src }} + {{ with $resource }} + <amp-img + src="{{ .Permalink | absURL }}" + srcset="{{ (.Resize "1200x").Permalink }} 1200w, + {{ (.Resize "800x").Permalink }} 800w, + {{ (.Resize "640x").Permalink }} 640w, + {{ (.Resize "480x").Permalink }} 480w, + {{ (.Resize "320x").Permalink }} 320w" + width={{ with $.width }} "{{ . }}" {{ else }} {{ $resource.Width }} {{ end }} + height={{ with $.height }} "{{ . }}" {{ else }} {{ $resource.Height }} {{ end }} + {{ with $.layout }}layout="{{ . }}"{{ end }} + {{ with $.alt }}alt="{{ . }}"{{ end }} + class="figure__image {{ with $.class }}{{ . }}{{ end }} {{ with $.caption }}figure__image--with-caption{{ end }}"> + </amp-img> + {{ end }} +</figure>
\ No newline at end of file diff --git a/layouts/partials/shortcodes/amp-image.html b/layouts/partials/shortcodes/amp-image.html index 81e3806..97b3858 100644 --- a/layouts/partials/shortcodes/amp-image.html +++ b/layouts/partials/shortcodes/amp-image.html @@ -1,20 +1 @@ -<figure class="figure {{ with .caption }}figure--with-caption{{ end }}"> - {{ with .caption }} - <figcaption class="figure__caption"> - {{ . }} - </figcaption> - {{ end }} - <amp-img - class="figure__image {{ with .class }}{{ . }}{{ end }} {{ with .caption }}figure__image--with-caption{{ end }}" - {{ with .alt }}alt="{{ range (split . " ") }}{{ . }} {{ end }}"{{ end }} - {{ with .attribution }}attribution="{{ range (split . " ") }}{{ . }} {{ end }}"{{ end }} - {{ with .srcset }}srcset="{{ range (split . " ") }}{{ . | absURL }} {{ end }}"{{ end }} - {{ with .tabindex }}tabindex="{{ . }}"{{ end }} - {{ with .onTap }}on="tap:{{- . -}}"{{ end }} - {{ with .role }}role="{{ . }}"{{ end }} - {{ with .width }}width="{{ . }}"{{ end }} - {{ with .height }}height="{{ . }}"{{ end }} - {{ with .layout }}layout="{{ . }}"{{ end }} - {{ with .media }}media="{{ . }}"{{ end }} - {{ with .src }}src="{{ . | absURL}}"{{ end }}></amp-img> -</figure>
\ No newline at end of file +{{- partial "blocks/image.html" . -}}
\ No newline at end of file |